Cara Membuat Floating Share Button Di Blog New Update

Cara Membuat Floating Share Button Di Blog New Update  -  Sobat Blogger kembali saya share tips dan trik blogger blogspot terbaru . Posting ini sangat berkaitan dengan postingku terdahulu yakni Cara Pasang Faceook Share Button di Blog  , tapi kali ini dalam postingku yang terbaru ini saya sedikit memberikan script dimana  share button ini akan melayang (floating share) .Bedanya kalau tombol share melayang ini hanya untuk berbagi artikel ke 4 layanan social

bookmark saja yaitu share artikel ke Facebook, Twitter, Google Buzz dan Google Plus One ( +1 ).

OK sobat langsung saja nih cara memasang share button melayang di blog :

1.      Login ke dashboard blogger anda.

2.      Pilih TataLetak > Elemen Laman > Add gadget (HTML/JavaScript).

3.       Copy script dibawah ini dan paste kedalam kotak HTML/JavaScript tersebut tadi.

 

<style>

#pageshare {position:fixed; bottom:15%; margin-left:-71px; 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 code from rayhanzhampiet.blogspot.com">

<div class="sbutton" id="fb">

<a href="http://www.facebook.com/sharer.php" name="fb_share" type="box_count">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 src="http://apis.google.com/js/plusone.js" type="text/javascript">

</script>

<g:plusone size="tall"></g:plusone></div>

</div>

4.       Save / Simpan.

Sangat mudahkan? Simple and fast….

Salam Blogger dan Selamat Berkreasi!!