Membuat Share Button Pada Blog - Posisi Melayang
Artikel Blog Blogging Google Adsense Komputer Teori Web WebTahukah temen-temen apa itu tombol share post? Tombol share post atau yang lebih dikenal sebagai tombol-tombol social bookmark sedikit banyak memang membantu meningkatkan pengunjung dari social bookmark yang bersangkutan. Contoh saja twitter, dengan mengintegrasikan feedburner dan twitter ketika ada artikel baru dari sebuah blog, maka secara otomatis akan langsung terupdate di twitter. Dengan begitu para follower yang penasaran dengan artikel tersebut akan langsung melihat artikelnya. Nah, untuk kali ini saya akan memberikan tips untuk memasang tombol share post melayang, untuk anda yang penasaran bisa dilihat contohnya disini.
1. Login dengan akun blogger anda.
2. Pilih Rancangan >> Elemen Halaman
3. Klik tambah gadget
4. Pilih HTML/Java Script
5. Silahkan Copy kode berikut dan paste didalam konten HTML/Java script nya
5. Yang terakhir tentu saja anda harus simpan.
Membuat tombol share post melayang ini sangat mudah karena kita tidak perlu pusing mengutak-atik HTML template kita. Kita tinggal memasukkan ke dalam widget sidebar. Untuk lebih jelasnya berikut ini adalah langkah-langkah pemasangannya :
1. Login dengan akun blogger anda.
2. Pilih Rancangan >> Elemen Halaman
3. Klik tambah gadget
4. Pilih HTML/Java Script
5. Silahkan Copy kode berikut dan paste didalam konten HTML/Java script nya
<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;
top: 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>
5. Yang terakhir tentu saja anda harus simpan.
Jika sudah selesai anda dapat lihat di sebelah kiri blog anda sekarang ada tombol share post yang melayang. Gampang bukan? Demikian tadi sedikit tutorial dari saya, selamat mencoba dan semoga bermanfaat.
