Pada kesempatan kali ini saya akan berbagi tips seputar cara
memasang share like keren melayang di sisi blog, dan sebelum
kepembahasannya ada baiknya anda baca dulu artikel sebelumnya tentang Tips Cara Aman Menggunakan Facebook dan Cara Memasang FansPage Facebook Melayang di Blog
,oke kita lanjut ketutorialnya dan pada gambar disamping ini adalah
contoh nanti hasilnya, apakah andaberminat untuk membuatnya, karena
menurut saya pribadi ini terbilang lumayan keren dan maknyus,,he he, oke
dech biar anda tidak lebih lama menunggu lagi nih dia cara membuatnya: 1.Silahkan Copas Kodenya dibawah ini, caranya masuk Tata Letak > Tambahkan Gadget > Cari HTML/JavaScript lalu pasteukan kode dibawah ini tepat pada kolom HTML/JavaScript unuk judulnya kosongkan saja.
<!--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 widget ini 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://tyrexcom.blogspot.com/2013/05/Cara-Membuat-Share-Like-Keren-Melayang-Disisi-Blog.html" target="blank"><font color="blue">Get Widget<font></font></font></a></div></div>
<!--Widget Share like FB tweet google plus digg Button Melayang End-->
2.Sekarang yang jadi pertanyaannya jika halaman posting anda sudah menampilkan atau terpasang google+ kemungkinan besar kode ini untuk google+ nya tidak akan banyak berfungsi.
3.Dan jika kebetulan template anda berbackground warna hitam saran saya untuk background kode diatas diubah dulu warnanya jika anda tidak tahu kode-kode warna silahkan lihat di artikel ini: kode warna html untuk blog
4.Lihat pada angka 15% berfungsi untuk mengatur letak tinggi posisi share button dari sisi bawah blog, silakan dikurangi jika posisinya ingin diturunkan atau di naikkan.
5.Pada angka 10 px adalah posisi dari tepi paling kanan blog, ditambah jika anda ingin mengetengahkan, sedangkan border: 1px solid black, adalah ukuran ketebalan batas kotak share button dan warna batas/garis share button itu sendiri, jika sudah selesai klik simpan saja. dan lihat hasilnya. untuk demonya lihat DISINI
Oke itulah pembahasan kali ini tentang Cara Membuat Share Like Keren Melayang Disisi Blog , semoga tips sederhana ini bisa bermanfaat buat anda semua, atas perhatiannya saya ucapkan terima kasih.
^_^ Backlinks Please Thanks ^_^
| URL |
| Code For Forum |
| HTML Code |
| Feed RSS |
0 Blogger Comments
