Memasang Tombol Share Melayang pada Blog - Floating Share Button

Tombol share melayang sebenarnya tidak beda dengan tombol share lainnya, yaitu berfungsi untuk berbagi/share konten blog ke berbagai jejaring sosial yang ada di internet. Bedanya, tombol yang satu ini posisinya melayang di blog kita, jadi walau pengunjung melakukan scrolling, tombol share tersebut akan tetap kelihatan di samping blog kita. Tentu dengan posisinya yang melayang itu, kesempatan untuk diklik oleh para pengunjung dengan tujuan sharing/berbagi akan semakin besar. Dalam Tombol share tersebut mencakup tiga layanan, yaitu: Google plus, facebook dan twitter.

Bagi Anda yang tertarik untuk menampilkannya ke dalam blog anda silahkan gunakan kode berikut, caranya:

1. login ke blogger
2. Pilih Rancangan
3. Lalu "add gadget"
4. Pilih HTML/Javascript
5. isikan dengan kode berikut di dalamnya
   

   <!-- floating page sharers Start-->
   <style type="text/css">
   #pageshare {position:fixed; bottom:15%; margin-left:-71px; float:left; border-radius:5px;-moz-border-radius:5px;-webkit-border-radius:5px;background-color:#fff;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="Share to Your Friends">
   <div style="clear: both;font-size: 16px;text-align:center;">
   </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 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>
   <!-- floating page sharers End --></div>

6. Klik Simpan

Silahkan lihat hasilnya! Menarik bukan?

Memasang Tombol Share Melayang pada Blog - Floating Share Button