468x60 Ads

Cara Membuat Share Button Melayang

Unknown | 15:00 | , , ,
Kawan masih ingat postingan saya sebelumnya tentang Cara Pasang Tombol Berbagi Plus :w; itulah yang akan saya bahas kembali karena Share Buttons [Tombol Berbagi] banyak model, bentuk atau penempatannya untuk menarik perhatian pengunjung Blog tentunya, terus yang sekarang akan saya bagikan pada kawan Cara Membuat Share Buttons Melayang yang screen shotnya sudah kawan lihat disamping kanan Blog ini :z; 

Cara Membuatnya :

  • Masuk Account Blogger dengan ID kawan
  • Pada Dasbor / Home pilih Tata Letak - Tambah Gadget
  • Pilih tanda [+] pada HTML / JavaScript
  • Copas Script berikut kedalamnya



<!-- Halaman Share Melayang Start  -->
<style>
#pageshare {position:fixed; bottom:10%; left:0px;float:left; border: 0px solid black; border-radius:5px;-moz-border-radius:5px;-webkit-border-radius:5px;background-color:transparent;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='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='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>
<br/><div style="clear: both;font-size: 9px;text-align:center;"><a href="http://blogbego-creation.blogspot.com/" target="blank"><font color="blue">[Widget]</font></a></div>
<!-- Halaman Share Melayang End -->
  • Teks yang saya beri warna merah adalah posisi Share Button, kawan bisa memindahkan posisinya dengan mengganti misalnya : dengan top, right  
  • Kawan bisa menambah atau mengurangi Tombol Berbaginya sesuai kebutuhan

 Kalau kawan ingin yang lebih simpel lagi silahkan Copas Script berikut 

<!-- AddThis Button BEGIN -->
<div class="addthis_toolbox addthis_floating_style addthis_counter_style" style="right:0px;top:200px;">
<a class="addthis_button_facebook_like" fb:like:layout="box_count"></a>
<a class="addthis_button_tweet" tw:count="vertical"></a>
<a class="addthis_button_google_plusone" g:plusone:size="tall"></a>
<a class="addthis_counter"></a>
</div>
<script type="text/javascript">var addthis_config = {"data_track_addressbar":true};</script>
<script type="text/javascript" src="//s7.addthis.com/js/300/addthis_widget.js#pubid=ra-50dbacda3907ad58"></script>
<!-- AddThis Button END --> 

  • Simpan Blog kawan
  • Script tersebut diatas kawan bisa gabung pada Gadget yang sudah ada


0 Kommentare:

Kommentar veröffentlichen