Cara Membuat Share Widget Melayang di Blog

Mungkin di blog anda sudah terdapat tombol share dan tombol google+1 yang sudah disediakan secara default oleh  blogger. Tapi saya akan mengajarkan anda bagaimana cara menambahkan widget sosial media (Facebook, Twitter, Google +1 (plus satu), StumbleUpon)  yang melayang  pada blog anda.

Ikuti langkah dibawah ini :

• Masuk ke blogger.
• Pilih Rancangan (Design) lalu tambah widget javascript.
• Copy dan Paste script berikut :

 <style type="text/css">  
   #pageshare {position:fixed; left:90px; bottom:15%; margin-left:-71px; float:left; border-radius:5px;-moz-border-radius:5px;-webkit-border-radius:5px;background-color:#c9f14e;padding:0 0 2px 0;z-index:10;}  
   #pageshare .sbutton {float:left;clear:both;margin:5px 5px 0 5px;}  
   .fb_share_count_top {width:48px !important;}  
   .fb_share_count_top, .fb_share_count_inner {-moz-border-radius:3px;-webkit-border-radius:3px;}  
   .FBConnectButton_Small, .FBConnectButton_RTL_Small {width:49px !important; -moz-border-radius:3px;/*bs-fsmsb*/-webkit-border-radius:3px;}  
   .FBConnectButton_Small .FBConnectButton_Text {padding:2px 2px 3px !important;-moz-border-radius:3px;-webkit-border-radius:3px;font-size:8px;}  
   </style>  
   <div id='pageshare' title="Get this from BloggerSentral.com">  
   <div class='sbutton' id='fb'>  
   <a name="fb_share" type="box_count" href="http://www.facebook.com/sharer.php">Share</a><script src="http://static.ak.fbcdn.net/connect.php/js/FB.Share" type="text/javascript"></script>  
   </div>  
   <div class='sbutton' id='rt'>  
   <script src="http://tweetmeme.com/i/scripts/button.js" type='text/javascript'></script>  
   </div>  
   <div class='sbutton' id='su'>  
   <script src="http://www.stumbleupon.com/hostedbadge.php?s=5"></script>  
   </div>  
   <div class='sbutton' id='digg' style='margin-left:3px;width:48px'>  
   <script src='http://widgets.digg.com/buttons.js' type='text/javascript'></script>  
   <a class="DiggThisButton DiggMedium"></a>  
   </div>  
   <div class='sbutton' id='gplusone'>  
   <script type="text/javascript" src="https://apis.google.com/js/plusone.js"></script>  
   <g:plusone size="tall"></g:plusone>  
   </div></div>  

• Lalu lihat blog anda, widget sosial media yang melayang sudah ada di samping kiri.

Jika ingin merubah warna background ubah nilai warna background yang bercetak tebal dengan warna sesuai keinginan anda.

Token : EJ58BS9WRV3M