Customize the Appearance of the Share Link

We receive a number of requests from users every day asking for help customizing the Share link on their ShortStack apps.  The process is much like the Links Widget, but there are a few differences to keep in mind.

.ss_box .share_link{
border: solid 1px #000000; /* border color, size, and line style */
background:#dd0000; /* background color of the Share link */
font-family: arial, sans-serif; /* font-family determines the web-safe font used for the link name */
color:#ffffff; /* color of the text in the Share link */
font-size: 14px; /* size of the text in the Share link */
border-radius: 3px; /* creates rounded corners, for a more button-like look.  The larger the number, the more rounded the corners.  If you don’t want rounded corners, change the border-radius to 0px */
padding:5px; /* amount of space between the text and the border of the button */
}

You can even change the color of the button when you hover over the Share link, here’s the CSS:

.ss_box .share_link:hover{
background:#000000; /* background color of the Share link when you hover over it */
}

You can change the Hex Values, pixel dimensions, border styles, and the font-family to suit your tab.  As always, here are a few great references to help you customize:

Hex Value Guide:  http://www.w3schools.com/cssref/css_colorsfull.asp
Guide to web-safe fonts:  http://www.w3schools.com/cssref/css_websafe_fonts.asp.