IBX58B0693E37B6C

KONTAK SAYA

Facebook

TELUSURI

MULAI DARI SINI

Home Daftar Isi

Home » » Cara Membuat Floating Share Button Di Blog

Cara Membuat Floating Share Button Di Blog


Cara Membuat Floating Share Button Di Blog | Share Artikel Blog


Cara Membuat Floating Share Button  - Membuat share artikel melayang (floating button) ini merupakan kelanjutan dari posting saya sebelumnya Cara Memasang Button Share Artikel di Blog. 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 ). 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 gadget baru 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.
Cara pemasangan widget pada template:
  1. Ganti/edit kode #pageshare {position:fixed; bottom:15%; margin-left:-71px; float:left; dengan kode ini #pageshare {display:scroll;position:fixed;top:165px;left:30px;
  2. Login ke dashboard blogger, pilih Rancangan > Edit HTML
  3. Letakkan script widget tepat diatas kode   pada template.
  4. Save / Simpan.
Cukup singkat bukan ternyata cara pasang share artikel melayang di blogspot ini ? Selamat mencoba cara membuat share artikel blog ini dan semoga sobat puas dengan hasilnya.


0 Saran Dan Kritik:

Posting Komentar

loading...
 
© 2010-2015 Harian Islam Agama Ku
Desain by OTIN | Islam Agamaku | Powered by Harian Islam