Sign Up! Login: Password: New User? Forgot? Support
Top Mods!
Wowhead Search
by sonofsamedi
Digital Clock
by Wolfar15
Admin Forums
Welcome to the GuildPortal Help Community! These forums are for admin-to-admin help.
Available Forums
Forums : Pimp My Site! > Share Link Styling
Mottie (MVP) 1/26/2010 11:48 AM EST : Share Link Styling
GuildPortal MVP
Mottie
Posts: 3883
Zomgawsh Poster

Share Link Styling

This CSS and Script will modify the styling of the share link.

Before
After

Code
Add this code to a free form text/HTML widget on the same page as your buttons (guild news).
You could potentially split the CSS out and add it to your Custom CSS section and place the code in the Footer Area.
<style type="text/css">
/* Overall Popup */
div#at15s {
 background-color: #444 !important;
 color: #ddd !important;
 border-color: #555 !important;
}
/* Popup Header & Footer */
#at15s_head, #at16pf, #at16pf a, div#at16pt, div#at16pt h4, div#at16pc, div#at16psf {
 background-color: #333 !important;
 border-color: #777 !important;
 color: #ddd !important;
}
/* Popup Button Colors */
div#at_hover .at_item, div#at_share .at_item {
 background: #444 !important;
 border-color: #777 !important;
 color: #ddd !important;
}
/* Hovered Popup Button Colors */
div#at_hover .at_item:hover, div#at_hover .at_item.athov, div#at_share .at_item:hover, div#at_share .at_item.athov {
 background: #777 !important;
 border-color: #444 !important;
 color: #ddd !important;
}
</style>
<script type="text/javascript">
$(document).ready(function(){
 var myimg = 'http://i201.photobucket.com/albums/aa236/Mottie1/testsite/icons/sm-share-en-dark.gif';
 $('img[src*="sm-share-en.gif"]').attr('src',myimg);
})
</script>
Customizing
  • Modify the popup colors using the CSS styling. Each section is labeled (with green comments) as to the colors in the popup it corresponds to, just modify the hex colors in blue and leave the "!important" flag at the end.

  • Change the share link image by changing the URL in the script (in orange).
TopBottom

Admins Online
There are   members online.
So-and-so has logged on!
%title%
%message%