Membuat Share Button di Blog v2 - Halo sobat ~_~, kali ini saya akan membahas Cara Membuat Share Button di Blog v2, Trik sederhana untuk mendapatkan trafik pengunjung ke blog adalah dengan memanfaatkan sosial bookmark dan direktori web yang ada. Sekarang, untuk menerapkan trik ini, anda hanya perlu memasang tombol social bookmark tanpa menggunakan javascript pada setiap artikel yang telah anda terbitkan.
Baca juga artikel tentang :Membuat Share Button di Blog (Facebook, Twitter, GPlus, LintasMe, Digg)
Berikut tutorial pemasangannya :
1. Login ke blogger
2. Pilih, Template -> Edit HTML
3. Copy kode dibawah ini dan pastekan tepat diatas tag ]]></b:skin>
.fbshare {line-height: 20px; color: #fff !important; background: #3b5998; text-decoration: none !important; border: 1px solid #313c7d; padding: 3px; font-family: Tahoma, verdana, sans-serif; font-size: 12px; border-radius: 2px;}
.twshare {color: #fff !important; background: #4099FF; text-decoration: none !important; border: 1px solid #3a8be8; padding: 3px; font-family: Tahoma, verdana, sans-serif; font-size: 12px; line-height: 20px; border-radius: 2px;}
.plshare {color: #fff !important; background: #c0361a; text-decoration: none !important; border: 1px solid #9c2c15; padding: 3px; font-family: Tahoma, verdana, sans-serif; font-size: 12px; line-height: 20px; border-radius: 2px;}
.dgshare {color: #fff !important; background: #5b88af; text-decoration: none !important; border: 1px solid #4a6f8f; padding: 3px; font-family: Tahoma, verdana, sans-serif; font-size: 12px; line-height: 20px; border-radius: 2px;}
.lkshare {color: #fff !important; background: #005a87; text-decoration: none !important; border: 1px solid #003f5e; padding: 3px; font-family: Tahoma, verdana, sans-serif; font-size: 12px; line-height: 20px; border-radius: 2px;}
.tcshare {color: #fff !important; background: #157501; text-decoration: none !important; border: 1px solid #105901; padding: 3px; font-family: Tahoma, verdana, sans-serif; font-size: 12px; line-height: 20px; border-radius: 2px;}
.sharebutton {background: #cccccc;border: 1px solid #999;padding: 5px;}
4.Jangan simpan template dulu, tapi lanjutkan dengan mencari tag <data:post.body/> dan jika sudah ketemu, copy kode dibawah ini tepat di bawah tag <data:post.body/>
<b:if cond='data:blog.pageType == "item"'>
<div class='sharebutton'>
Share This Article To:
<a class='fbshare' expr:href='"http://www.facebook.com/sharer.php?u=" + data:post.url' rel='nofollow' target='_blank'>Facebook</a>
<a class='twshare' expr:href='"http://twitter.com/share?url=" + data:post.url' rel='nofollow' target='_blank'>Twitter</a>
<a class='plshare' expr:href='"https://plus.google.com/share?url=" + data:post.url' rel='nofollow' target='_blank'>Google+</a>
<a class='lkshare' expr:href='"http://www.linkedin.com/cws/share?url=" + data:post.url' rel='nofollow' target='_blank'>Linkedin</a>
<a class='tcshare' expr:href='"http://technorati.com/faves?sub=addfavbtn&add=" + data:post.url' rel='nofollow' target='_blank'>Technorati</a>
<a class='dgshare' expr:href='"http://digg.com/submit?url=" + data:post.url' rel='nofollow' target='_blank'>Digg</a>
</div>
</b:if>
Perhatikan !
Jika di dalam template terdapat banyak <data:post.body/>, maka cari kode HTML yang kurang lebih seperti dibawah ini dan pastekan kode di atas tepat di bawahnya.
<b:if cond='data:blog.pageType == "item"'>
<data:post.body/>
<b:else/>
<b:if cond='data:blog.pageType == "static_page"'>
<data:post.body/>
</b:if>
</b:if>
<div style='clear: both;'/> <!-- clear for photos floats -->
</div>
5. Simpan template dan lihat hasilnya.
16 komentar
Click here for komentarmakasih infonya memang membuat share button di blog bermanfaat untuk meningkatkan pengunjung karena dengan mengkliknya maka artikel akan tersebar ke jejaring sosial.
Balasinfo yg bagus gan
Balaswah boleh dicoba nih... thanks infonya kawan
BalasWWiihh, kyaknya keren nih. tapi mana SSnya ???
Balasbagus nih gan
Balasane juga udah pake bang, bawaan dari template mas sugeng :D
Balaskeren sob..
Balassaya coba dulu dehh..
keren, makasih ya infonya :)
Balaskeren nih, tinggal ditambahin sentuhan style css jadi tambah maknyos nihhh...
BalasSS nya da di atas sob :D
Balasbener bgt tuh (h)
BalasKeren :D
Balasmantap mas
Balasshare nya keren gan...
Balaslangsung dicoba dah...thanks
Tolong berkomentar sesuai topik pembicaraan, dilarang spam dan jangan menaruh link aktif, terimakasih. Join This Site Show Konversi KodeHide Konversi Kode Show EmoticonHide Emoticon