cara membuat tombol share melayang disisi blog |
Coffeedrink- salah satu cara untuk meramaikan lalu lintas diblog anda, anda mungkin sering melakukan share ke semua media sosial, memang cra tersebut sangat ampuh dan mujarab, nah pada malam hari ini saya akan berbagi tentanag cara membuat tombol share melayang disisi blog, (seperti gambar diatas) cara membuat tombol tersebut sangat mudah dengan menyalin code javascrip dibawah ini anda sudah bisa menampilkan tombol share tersebut.
ikuti langkah-langkah dibawah ini
- klik tata letak
- add gadget
- pilih HTML JAVA/SCRIP
- salin code dibawah ini
<!--Widget Share like FB tweet google plus digg Button Melayang Start-->
<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:#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://www.super-gaptek.com/2012/02/cara-membuat-blog-di-blogspot.html" target="blank"><font color="blue">Cara Membuat<font></font></font></a></div></div>
<!--Widget Share like FB tweet google plus digg Button Melayang End-->
Pengaturan lihat kode-kode warna merah:
angka 15% mengatur letak tinggi posisi share button dr sisi bawah blog, silakan dikurangi jika posisinya ingin diturunkan
angka 10 pixel adalah posisi dari tepi paling kanan blog, ditambah jika sobat ingin mengetengahkan.
sedangkan border: 1px solid black, adalah ukuran ketebalan batas kotak share button dan warna batas/garis share button itu sendiri.
dan warnah hijau adalah untuk merubah posisi yang diinginkan bisa di kiri dan kanan terserah anda
lalu klik save
saran saya silakan anda pratinjau dahulu jika sudah berhasil silakan di save lagi.
saran saya silakan anda pratinjau dahulu jika sudah berhasil silakan di save lagi.
0 komentar:
Posting Komentar