Download Latest Codefight CMS From Github

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