Cara Membuat Tombol Share / Berbagi Keren di Blog

---

Tombol share memang sangat berguna untuk sebuah blog entah blog dengan kategori apapun, pastinya Anda sudah tau apa itu tombol share atau tombol berbagi (facebook, twitter, google+ dll). Mungkin di setiap blog sudah pasti mempunyai tombol share, baik itu editan mapun yang masih standar bawaan template. Nah disini saya akan membagikan script tombol share tersebut dengan tampilan keren dan cukup SEO, dilihat saja penampakan nya :

Gambar oleh (www.just4rt.com)

Gimana cukup keren bukan untuk diterapkan di blog Anda semua , Simak tutorialnya berikut ini :

1. Pertama Anda masuk ke akun blog, lalu pilih Template --> Edit HTML

2. Pada menu template tekan CTRL+F pada keyboard, lalu ketikkan atau cari kode ]]></b:skin> lalu paste kode berikut tepat diatas nya

 /* SHARE BUTTON */
#share-just4rt{font-size:13px;margin:10px 0px 10px;padding:8px 5px;}#share-just4rt p{float:left;display:block;padding:4px 0px 5px 0px;margin:5px 3px 0;}#share-just4rt a{position:relative;float:left;box-shadow:1px 1px 5px rgba(1,1,1,.1);border-radius:5px 5px;display:block;color:#fafafa;padding:5px 8px;margin:2px 3px 3px;
border:2px solid #fff;}#share-just4rt a:hover{top:1px;
left:1px;box-shadow:0px 0px 3px rgba(1,1,1,.1)} 

3. Cari kode <data:post.body/> (kode tersebut tidak hanya satu, tempel pada bagian kode yang terakhir, tergantung template Anda) lalu copy paste kode dibawah tepat dibawahnya

 <div id='share-just4rt'>
<p>
<b>Bagikan ke : </b></p>
<a expr:href='"http://www.facebook.com/sharer.php?u=" + data:blog.url' rel='nofollow' style='background:#3b5998;' target='_blank' title='Bagikan ke Facebook'>Facebook</a>
<a expr:href='"http://plus.google.com/share?url=" + data:blog.url' rel='nofollow' style='background:#c0361a;' target='_blank' title='Bagikan ke Google+'>Google+</a>
<a expr:href='"https://twitter.com/intent/tweet?url=" + data:blog.url + "&text=" + data:post.title + "&via=Just4rtBlog&lang=id"' rel='nofollow' style='background:#4099ff;' target='_blank' title='Bagikan ke Twitter'>Twitter</a>
<a expr:href='"http://digg.com/submit?url=" + data:post.url + "&title=" + data:post.title' rel='nofollow' style='background:#111111;' target='_blank' title='Bagikan ke Digg'>Digg</a>
<a expr:href='"http://technorati.com/faves?sub=addfavbtn&add=" + data:post.url' rel='nofollow' style='background:#67b500;' target='_blank' title='Bagikan ke Technorati'>Technorati</a>
<a expr:href='"http://www.reddit.com/submit?url=" + data:post.url + "&title=" + data:post.title' rel='nofollow' style='background:#4E7DA9;' target='_blank' title='Bagikan ke Reddit'>Reddit</a>
<script>
//<![CDATA[
var uri = window.location.href;
var ttle = document.title;
document.write("<a href='http://www.lintas.me/?c=bookmarklet&url="+uri+"&title="+ttle+"' target='_blank' rel='nofollow' style='background:#FF9900;' title='Bagikan ke LintasME'>Lintaskan</a>");
//]]>
</script>
<div class='clear'/>
</div>

Dan klik simpan.

Trims

Artikel Terkait: