You can modify the look of ShareProgress buttons to match your organizations branding and theme.
Once your buttons are generated, you can modify your buttons with CSS.
1. First put your buttons in a div container. In the example below, buttons are in a container named .share-buttons
.
<div class="share-buttons">
{Share Buttons Go Here}
</div>
2. Target the class for each share button to set your own size, background or margins. To customize specific buttons, use the following classes, .sp_fb_small
for Facebook, .sp_tw_small
for Twitter, and .sp_em_small
for email.
Modified Button Sample CSS
.share-buttons .sp_fb_small a {
width: 75px;
height: 28px;
background: #3b579d url(http://www.shareprogress.org/media/FSS.png) 0px 0px no-repeat;
float: left;
margin-right: 5px;
margin-left: 5px;
}
3. Place this code either in a CSS style block or your stylesheet.