Home » » Cara Membuat Tombol Share Melayang di blogspot

Cara Membuat Tombol Share Melayang di blogspot

Cara Membuat Tombol Share Melayang di blogspot.
Dengan adanya tombol share melayang dapat mempercantik blog kita juga dapat  memudahkan pengunjung blog untuk membagikan postingan atau isi blog yang kita buat.

Adapun caranya adalah sebagai berikut :



1.Login ke Blog Anda
2.Klik Dasbor
3.Klik Rancangan terus klik elemen laman
4.Klik add gadget/tambah gadget,dan pilih/klik HTML/javascript
5.Masukkan kode HTML( silahkan sobat copy paste kode HTML) di bawah ini :

<!-- Tombol Share Melayang Start-->
<style>
#pageshare {position:fixed; bottom:35%; margin-left:-190px; float:left; border-radius:5px;-moz-border-radius:5px;-webkit-border-radius:5px;background-color:#fff;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;/*bs-fsmsb*/-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="Get this from tips blogbego.blogspot.com">
<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>
<div class='sbutton' id='rt'>
<script src="http://tweetmeme.com/i/scripts/button.js" type='text/javascript'></script>
</div>
<div class='sbutton' id='gb'>
<a class='google-buzz-button' data-button-style='normal-count' href='http://www.google.com/buzz/post' title='post on google buzz'>
<script src='http://www.google.com/buzz/api/button.js' type='text/javascript'></script>
</a></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='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='su'>
<script src="http://www.stumbleupon.com/hostedbadge.php?s=5"></script>
</div>
<!-- Tombol Share Melayang End --></div>
Catatan :
Aturlah posisi yang tepat untuk tombol share ini dengan memperhatikan kode :
bottom:35%; margin-left:-190px; 
Apabila menurut anda telah sesuai dengan keadaan template anda barulah di SAVE.

Selesai.
Share this article :

Post a Comment