Selasa, 08 Januari 2013

Share Buton Melayang di blog

Pada Tutorial Blog berikut ini Admin menyajikan tentang Share Buton Melayang, walaupun ada banyak penempatan share buton yang fungsinya untuk memudahkan pengunjung blog kita untuk me Like Facebook maupun Twiter .


Sebenarnya pada widget bawaan blog juga sudah ada tombol ini yang letaknya di bawah Postingan tapi di sini admin ingin berbagi kepada sobat bagaimana share Buton dapat langsung di lihat oleh pengunjung blog kita dan pengunjungpun mau menclik nya. tampilanya akan seperti dgambar disamping.

baiklah Admin tidak akan berlama lama lagi, langsung aja kita coba
  • Pertama masuk ke Dasboard blog sobat
  • kemudian pilih Layout --> setelah tampil halaman Layout template kita clik Add aGadget (boleh dimana aja)
  • kalau sudah tampil halaman Gadget --> pilih   HTML/JavaScript HTML/JavaScript Add clik tombol Tambah
  • kemudian akan tampil halaman Configure HTML/JavaScript  
  • Pada kolom Title kosongkan saja dan pada kolom Copy kode dibawah ini :


<!--Widget Share like FB tweet google plus digg Button Melayang Start-->

<style>

#pageshare {position:fixed; bottom:15%; right:10px; float:left; border: 1px solid black; border-radius:5px;-moz-border-radius:5px;-webkit-border-radius:5px;background-color:#eff3fa;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='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 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='su'><script src="http://www.stumbleupon.com/hostedbadge.php?s=5"></script></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='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><br/><div style="clear: both;font-size: 8px;text-align:center;"><a href="http://www.super-gaptek.com/2012/02/cara-membuat-blog-di-blogspot.html" target="blank"><font color="blue">Cara Membuat<font></font></font></a></div></div>

<!--Widget Share like FB tweet google plus digg  Button Melayang End-->

  • kemudian Pastekan di kolom Content Setelah selesai clik simpan dan lihat Hasilnya
  • Selamat Mencoba ya.... jangan lupa gabung di blog ini ya....