Social Share Plugin

Posted by Damodar Bashyal on October 07, 2011

 

Do you want to use the share bar that Mashable is using? If so download this script.

http://skin.zoosper.com/skin/global/js/share.mini.js

How to use this?

I am using addthis for share tracking, so you need to register at addthis.com. then use the following code.

<div id="sharebox" class="">
        <div class="cfshare">
            <script type="text/javascript">
            jQuery(document).ready(function(){
                if(jQuery('div#sharebox').length > 0)
                {
                    jQuery('#sharebox').cfShare({
                        addthisId       : 'codefight',
                        animate         : false //or true,
                        bgColor         : '#fff',
                        fromPosition    : 'original', //or 'top'
                        marginFixed		: '0 7px 4px -572px',
                        pageWidth       : 980,
                        shareClients    : ['facebook','facebooksend','twitter', 'googleplusone', 'linkedin', 'addthis'],
                        shareLeft       : -84,
                        sharePadding    : 5,
                        shareWidth      : 70,
                        startTop        : 70,
                        topPadding      : 0
                    });
                }
            })
        </script>
        </div>
    </div>

NOTES:

  1. addthisId: Addthis.com ID Goes Here If You Want To Track Page Shares.
  2. animate : Do you want to animate your share bar? Default is true.
  3. bgColor : Set your color for share background. default is '#fff'
  4. fromPosition: 'original', or 'top'. Do you want to float to left from top or from the original place you inserted code.
  5. marginFixed : Margin for floating sharebar when animation is set to false. You may need to adjust value of left margin.
  6. pageWidth : Website page wrapper width.
  7. shareClients: 'facebook', 'facebooksend', 'twitter', 'googleplusone', 'linkedin', 'addthis'. You can select your choice and change the position as you like.
  8. shareLeft : Left position from the place you inserted this code.
  9. sharePadding : Padding for sharebar. Default is 5px.
  10. shareWidth : Width of the sharebar for floating menu.
  11. startTop : Top-margin when page load [normally height of header]
  12. topPadding : Top padding for the sharebox.
 
not published on website


QR Code: Social Share Plugin