Customize the Appearance of the Share Link
This content explains how to customize the Share link on ShortStack apps using CSS, including changing colors and font styles.
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.
