» » Cara Mudah Membuat Tombol Share Melayang di Blog

Cara Mudah Membuat Tombol Share Melayang di Blog

Kali ini saya aka membuat tombol share melayang di blog, hal ini agar pengunjung blog tertarik untuk mengshare artikel tersebut ke facebook, twitter, dan lain-lain, sehingga artikel sobat bisa lebih dikenal oleh banyak orang. jika masih bingun seperti apa sih gambarnya nih gue kasih contohnya.
 

Nah gan seperti itu contohnya gimana bagus kan ? gambar di atas menampilkan banyak share seperti share facebook, twitter, juga digg. lengkap kan sobat blogger ? kalau sobat tertarik untuk membuat nya silahkan ikuti cara-cara berikut ini :
  • Login akun blog sobat
  • Lalu masuk ke menu tata letak,  kemudian tambah gadget
  •   Lalu pili Html/Javascript
      <!--SideBar Floating Share Buttons Code Start-->
      <style>

      #pageshare {position:fixed; bottom:15%; left:10px; float:left; border: 1px solid black; border-radius:5px;-moz-border-radius:5px;-webkit-border-radius:5px;background-color:#eff3fa;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;-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 This With Your Friends">
      <div class='sbutton' id='gb'><script src="http://connect.facebook.net/en_US/all.js#xfbml=1"></script><fb:like layout="box_count" show_faces="false" font=""></fb:like></div>
      <div class='sbutton' id='rt'><a href="http://twitter.com/share" class="twitter-share-button" data-count="vertical" >Tweet</a><script src='http://platform.twitter.com/widgets.js' type="text/javascript"></script></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='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='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><br/><div style="clear: both;font-size: 12px;text-align:center;"><a href="http://infonetmu.blogspot.com/2012/02/membuat-tombol-share-melayang-di-blog.html" target="blank"><font color="black">[Get This]<font></font></font></a></div></div>





    •  Copy script di atas lalu masukan pada kolom Html/javascript tadi.
    •  Klik simpan
    Selesai, gimana gampang kan cara buatnya kalau anda ingin melihat hasilnya tinggal klik"lihat blog". Nah demikianlah artikel saya yang berjudul cara membuat  tombol share melayang di blog, semoga bermanfaat bagi sobat blogger semua :) 
      0 Komentar untuk "Cara Mudah Membuat Tombol Share Melayang di Blog"