fix

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.

By Dana Kilroy ・1 min read
ShortStack Tips & Tricks

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.

About the author

By Dana Kilroy ・1 min read
Follow

Dana Sullivan Kilroy is a communications professional with more than 20 years of experience delivering compelling content. Her work has appeared in national, award-winning publications and sites, including: The New York Times, The Los Angeles Times, The Wall Street Journal, USA Today, and Fast Company, Inc.

Get productivity tips straight to your inbox

Thank you!
Your submission has been received!
Oops! Something went wrong while submitting the form.
We’ll email you 1-3 times per week—and never share your info.