Floating Share Tombol Jejaring Sosial Melayang

Floating Share Tombol Jejaring Sosial Melayang - pada postingan kali ini kita akan membahas lagi tentang Social Bookmark lagi, sebelumnya saya juga pernah membahas Social Bookmark tetapi pada Social Bookmark atau tombol jejaring sosial sebelumnya letak dan penerapanya berada tepat di bawah posting jadi kita hanya bisa melihat pada saat membaca suatu artikel, nah kita akan membahas yang berbeda dari yang social bookmark sebelumnya, pada tombol jejaring social ini tempat dan munculnya tepat berada di samping kiri blog, jadi kapanpun kita bisa melihatnya, heheheh menarik juga, fungsinya juga sama saja dengan tombol jejaring atau social bookmark lainnya yaitu membagikan suatu artikel ke jejaring sosial lainnya seperti facebook, twitter, Digg dll. Bagaimana cara membuatnya kita mulai dengan langkah yang pertama.

  • Masuk dahulu ke Blogger sobat,
  • Masuk ke Rancangan,
  • Pilih Elemen Edit,
  • Klik Tambah Gadget,
  • Selanjutnya, cari dan klik Javascript/Html
  • Masukan script di bawah ini dan letakan kedalam Javascript/Html tersebut.
<style  type="text/css">
*{margin:0;padding:0;}

* html #z33sHare{
position:  absolute;
}

#z33sHare{
right:1%;width:  70px;background:transparant;border:0px solid  #E7E7E7;-moz-border-radius:3px;-webkit-border-radius:3px;
position:fixed;
bottom:  20%;
}

#z33sHare div{
padding:6px 6px 6px 5px;
}

#stw{
margin-left:-2px;
}

#sfs{
margin-left:-5px;
}

</style>
<div  id="z33sHare">
<div id="ssl-box">
<div id="stw">
<a  href="http://twitter.com/share" class="twitter-share-button"  data-count="vertical">Tweet</a><script  type="text/javascript"  src="http://platform.twitter.com/widgets.js"></script>
</div>
<div><a  title="Post to Google Buzz" class="google-buzz-button"  href="http://www.google.com/buzz/post"  data-button-style="normal-count"></a><script  type="text/javascript"  src="http://www.google.com/buzz/api/button.js"></script>
</div>
<div>
<script  type="text/javascript">
(function() {
var s =  document.createElement('SCRIPT'), s1 =  document.getElementsByTagName('SCRIPT')[0];
s.type =  'text/javascript';
s.async = true;
s.src =  'http://widgets.digg.com/buttons.js';
s1.parentNode.insertBefore(s,  s1);
})();
</script>
<a class="DiggThisButton  DiggMedium"></a>
</div>
</div>
<div><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  style="clear:both;"></div></div>
  • Bagaimana ? Tidak sulit bukan.
  • Terakhir, Simpan dan lihat hasilnya.
Selamat Mencoba.

0 komentar:

Posting Komentar