CARA MEMBUAT TOMBOL SHARE MELAYANG DI BLOG

Untuk meningkatkan traffic blog kita, selain upaya optimasi SEO kita juga perlu membuat tombol share di blog kita yang akan menghubungkan blog dengan media jejaaring sosial seperti facebook, twitter ataupun google+. Tutorial kali ini saya akan membahas cara membuat tombol share melayang di sisi kiri atau kanan blog anda.

Berikut langkah-langkah pemasangannya di blog :

1. Masuk ke akun > Pilih Tata Letak
2. Klik Tambah Gadget di bagian sidebar
3. Pilih HTML/Javascript kemudian copy paste kode di bawah ini

<!--Widget Share like FB tweet google plus digg Button Melayang Start-->

<style>

#pageshare {position:fixed; bottom:15%; left:10px; float:left; border: 1px solidblack; 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="bagikan ke teman anda"><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: 8px;text-align:center;"><a href=" http://goo.gl/Xf5tBF"  target="blank"><font color="blue">Get Widget Here<font></font></font></a></div></div>

<!--Widget Share like FB tweet google plus digg  Button Melayang End-->

4. Simpan  widget dan lihat blog anda

Note : Tulisan berwarna merah adalah posisi widget, saya memakai widget ini disebelah kiri jadi saya tulis left, kalau anda ingin mengubahnya di sebelah kanan tinggal ganti tulisan berwarna merah dengan right.

Selesai...mudah kan ??
oh iya jika anda sudah memiliki tombol google+ ( G+ ) baik di atas maupun dibawah postin, kemungkinan tombol google+ di widget yang kita buat tadi tidak akan muncul.

Demikianlah tutorial cara menampilkan tombol share melayang di blog. Semoga bermanfaat.

Sumber: http://inticoretan.blogspot.com/2013/11/cara-membuat-tombol-share-melayang-di-blog.html