Setiap blogger ingin meningkatkan traffic blog-nya. Mereka gunakan segala cara untuk meningkatkan traffic blog mereka dan jejaring sosial juga merupakan salah satu cara terbaik untuk meningkatkan traffik blog kita. Tahukah anda bahwa penduduk atau orang terbanyak didunia berada di negara mana? Jawabannya: negara pertama adalah negara Cina dan selanjutnya disusul oleh negara Facebook..? loh ko Facebook?. Ya iyalah, setiap orang baik tukang becak, tukang las, dan sebagainya sekarang sudah mempunyai facebooknya sendiri. orang yang terdaftar sebagai pengguna facebook melebihi penduduk asli suatu negara. Bahkan Indonesia juga kalah dengan penduduk facebook. haha
Jadi, kesimpulannya, jika kita menshare atau memberitahukan orang-orang di facebook tentang artikel atau posting blog kita. Itu akan menjadikan sebuah keuntungan bagi blog kita. Kalo nggak salah twitter ada di posisi ke 5. Sudah sudah jangan banyak cingcong lagi, mari kita menuju ke topik pembahasan. Setelah sebelumnya saya memposting tentang Cara Membuat Daftar Isi otomatis dengan desain Keren. Sekarang saya ingin menshare tentang cara membuat tombol share stylish dibawah postingan. Kalo anda mengikuti tutorial dibawah dengan baik dan benar, nanti hasil screenshotnya akan mirip seperti gambar dibawah ini:
Bagaimana menurut anda? baguskah atau biasa-biasa saja? Didalam widget ini terdapat beberapa tombol share seperti Facebook share button, Facebook like buttton, Tweet button, Pinterest button, Digg button, Stumbleupon button. Serta disertai jumlah orang yang mensharing artikel kita. Jika anda ingin memasangnya anda dapat mengikuti langkahnya dibawah ini:
This Step
1 . First of all go first into your blogger account
2 . Next go to the Templates tab .
3 . Then Edit HTML .
4 . Find the code </head> by pressing CTRL + F.
5 . Save the following code just above the </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>
<script type='text/javascript'>stLight.options({onhover:false , doNotHash: true, doNotCopy: true, hashAddressBar: false});</script>
6. Then look <data:post.body/> code by pressing CTRL + F.
7. Save the following code just below the code <data:post.body/>
<b:if cond='data:blog.pageType == "item"'>
<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>
8. SAVE your template and now look your post, more amazing.<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>
9. Please give a comment if this helps :)
