Cara Mudah Memasang Tombol Share Keren Dibawah Posting Blog

Oleh Bardil

20 Juni, 2014

Bagikan :

Tweet

Cara Mudah Memasang Tombol Share Keren Dibawah Posting Blog 

Cara Mudah Memasang Tombol Share Keren Dibawah Posting Blog – Social media dan blogger, 2 kata yang tidak dapat dipisahkan. Dimana, social media (Baik itu Facebook, Twitter dan yang lainnya) memiliki peranan yang amat sangat penting dalam dunia blogging, yaitu meningkatkan traffic dan pengunjung blog. Nah, kali ini saya akan membagikan widget yang berfungsi untuk mempermudah pengunjung untuk menshare artikel blog Anda ke social media. Dengan desainnya yang cukup keren, tombol ini akan cukup menarik perhatian pengunjung untuk menshare artikel, dan akan berimbas pada jumlah pengunjung serta SEO blog Anda. Previewnya :

Bagaimana, keren bukan? Berikut ini langkah – langkah pemasangannya :

1.     Seperti biasa, buka akun blogger Anda, lalu masuk ke Template. Buat backup dari template blog Anda, lalu klik Edit HTML.

2.     Tekan CTRL+F, dan cari kode </head>. Jika sudah ketemu, letakkan kode berikut tepat diatas kode </head>.

<script type="text/javascript" src="http://w.sharethis.com/button/buttons.js"></script> <script type='text/javascript'>stLight.options({onhover:false , doNotHash: true, doNotCopy: true, hashAddressBar: false});</script>

3.     Lanjutkan dengan mencari kode <data:post.body/>. Kode ini biasanya ada banyak, namun pilih yang kedua. Lalu, copy dan pastekan kode berikut tepat dibawahnya.

<b:if cond='data:blog.pageType == &quot;item&quot;'>

<style>

.doncaprio-share-buttons{-webkit-border-radius: 5px;-moz-border-radius: 5px;border-radius: 5px;border:1px solid #BBBBBB;background-color:#FFFFFF;-webkit-box-shadow: #B3B3B3 5px 5px 5px;-moz-box-shadow: #B3B3B3 5px 5px 5px;box-shadow: #B3B3B3 5px 5px 5px;padding: 5px;margin: 10px;}

</style>

<p align='center' class='doncaprio-share-buttons'>

<span class='st_facebook_hcount' displayText='Facebook'/>

<span class='st_plusone_hcount' displayText='Google +1'/>

<span class='st_twitter_hcount' displayText='Tweet'/>

<span class='st_pinterest_hcount' displayText='Pinterest'/>

<span class='st_digg_hcount' displayText='Digg'/>

<span class='st_stumbleupon_hcount' displayText='StumbleUpon'/>

<span class='st_fblike_hcount' displayText='Facebook Like'/>

</p></b:if>

4.     Terakhir, klik Simpan, dan lihat hasilnya.

Tips :

Jika tombol share keren ini tidak terlihat, coba pindahkan kode pada step 3 ke <data:post.body/> yang lain.

Anda dapat menghapus beberapa tombol yang menurut Anda tidak penting. Caranya, hapus baris yang berwarna merah. Kata terakhir pada baris tersebut akan menunjukkan tombolnya. Misal “Facebook” merujuk ke tombol share Facebook, dsb

Selamat mencoba, dan salam blogger! Jangan lupa untuk share artikel ini dan meninggalkan komentar. Terima kasih!

 

Tag : Belajar menjadi bloger keren