Hidup itu perlu perubahan sob, salah satu caranya yaitu kita harus bisa mengikuti zaman. Saat ini zamannya teknologi, jadi kita juga harus tahu hal-hal apa yang terbaru. Karena kalau kita tidak bisa mengikuti maka kita akan ketinggalan zaman. Minimalnya kita tahu dulu internet, karena dengan berinternet kita bisa mencari informasi atau berita yang bukan hanya dari dalam negeri tapi juga bersifat global tentunya. Apalagi sekarang banyaknya sosial media yang memudahkan kita untuk berkomunikasi di dunia maya dengan orang lain. Daripada bicaranya lebih mendalam, langsung saja pada pembahasannya yaitu tentang membuat tombol share sosial media melayang yang ada di blog saya ini. Berikut cara-caranya:
Masuk Dasboard blogger > Pilih Blog > Tata Letak > Tambah Gadget > HTML/Javascript
Copy-Paste kode di bawah ini:
<!–bangiz-tombol sosial media melayang–>
<style>
#pageshare {position:fixed; bottom:15%; right:30px; float:right; border: 0px solid black; border-radius:3px;-moz-border-radius:3px;-webkit-border-radius:3px;background-color:#eff3fa;padding:0 0 2px 0;z-index:10;}
#pageshare .sbutton {float:left;clear:both;margin:3px 3px 0 3px;}
.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>
<br/><div style="clear: both;font-size: 9px;text-align:center;"><a href="http://bangiz.blogspot.com/search/label/Animasi" target="blank"><font color="black">[Get Other]<font></font></font></a></div></div>
<!– bangiz-tombol sosial media melayang –></!–></!–bangiz-tombol>
Kalau sudah jangan lupa simpan, lalu lihat hasilnya
Kalau Anda menggunakan dasar template yang gelap lebih baik gunakan kode yang di bawah ini:
<!– bangiz-tombol sosial media melayang –>
<style>
#pageshare {position:fixed; bottom:15%; right:10px; float:left; border: 1px solid black; border-radius:5px;-moz-border-radius:5px;-webkit-border-radius:5px;background-color:#000000;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>
<br/><div style="clear: both;font-size: 9px;text-align:center;"><a href="http://bangiz.blogspot.com/search/label/Animasi" target="blank"><font color="black">[Get Other]<font></font></font></a></div></div>
<!– bangiz-tombol sosial media melayang –>
Begitulah cara membuat tombol sosial media melayang dengan menggunakan kode HTML versi bangiz. Jika ada yang mau ditanyakan, silahkan berkomentar. Happy blogging.