Cara Membuat Floating Share Button Di Blog

Cara Membuat Floating Share Button  - Membuatshare button melayang (floating button) ini merupakan kelanjutan dariposting saya sebelumnya Cara Memasang Button Share Artikel di Blog. Bedanya kalautombol share melayang ini hanyauntuk berbagi artikel ke 4 layanan social bookmark saja yaitu share artikel ke Facebook, Twitter, GoogleBuzz dan Google Plus One ( +1 ). Yang penting bisa berbagi artikel postingan lah.

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

1.      Login ke dashboard blogger anda.

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

3.      Copy script dibawah ini dan paste kedalam gadgetbaru 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:00 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">

<divclass="sbutton" id="fb">

<ahref="http://www.facebook.com/sharer.php"name="fb_share"type="box_count">Share</a><scriptsrc="http://static.ak.fbcdn.net/connect.php/js/FB.Share"type="text/javascript">

</script></div>

<divclass="sbutton" id="rt">

<scriptsrc="http://tweetmeme.com/i/scripts/button.js"type="text/javascript">

</script></div>

<divclass="sbutton" id="gb">

<aclass="google-buzz-button"data-button-style="normal-count"href="http://www.google.com/buzz/post" title="poston google buzz">

<scriptsrc="http://www.google.com/buzz/api/button.js"type="text/javascript">

</script>

</a></div>

<divclass="sbutton" id="gplusone">

<scriptsrc="http://apis.google.com/js/plusone.js"type="text/javascript">

</script>

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

</div>

4.      Save / Simpan.

Cukup singkat bukan ternyata cara pasang share artikel melayang di blogspot ini ? Semoga sobat puas dengan hasilnya.