Saya akan memberi Tutorial tentang cara memasang Tombol share dibawah postingan yang Ringan, Tutorial yang satu ini saya dapatkan dari mas Kompi Ajaib , cuma ada bagian yang saya tambahkan, seperti tombol Share Digg dan Linkedin, karena mas Kompi ajaib hanya membuat 3 Tombol Share saja yaitu tombol Share to Fb - Share to Twitter - Share to Gplus+, walaupun gak seberapa hehehe.
(Sobat bisa melihat previewnya diatas atau Melihat Tombol Share yang saya gunakan sekarang. )
Ok, langsung saja kita mempraktekannya.
- Copy Code berikut :
<!-- Horizontal social buttons Start -->
<b:if cond='data:blog.pageType == "item"'>
<div style='background:#f6f6f6; border:2px solid #fff;width:100%;height:22px;text-align:left;font:normal 11px Arial;color:#333;margin:10px 0;padding:10px 0 5px'>
<div style='float:left;padding:2px 0;margin-right:15px;font:bold 14px Arial;color:#333'>
<strong>Share This Article</strong> :
</div>
<a expr:href='"http://www.facebook.com/sharer.php?u=" + data:post.url' style='color: #fff; background: #3b5998; text-decoration: none; border: 1px solid #313c7d; padding: 3px; border-radius: 3px; font-family: arial, verdana, sans-serif; font-size: 13px; line-height: 20px;' target='_blank' title='Share to Facebook'>Share on fb</a>
<a expr:href='"http://twitter.com/share?url=" + data:post.url' style='color: #fff; background: #4099FF; text-decoration: none; border: 1px solid #3a8be8; padding: 3px; border-radius: 3px; font-family: arial, verdana, sans-serif; font-size: 13px; line-height: 20px;' target='_blank' title='Share to Twitter'>Tweet</a>
<a expr:href='"https://plus.google.com/share?url=" + data:post.url' style='color: #fff; background: #c0361a; text-decoration: none; border: 1px solid #9c2c15; padding: 3px; border-radius: 3px;font-family: arial, verdana, sans-serif; font-size: 13px; line-height: 20px;' target='_blank' title='Share to Google+'>Share on G+</a>
<a expr:href='"http://digg.com/submit?url=" + data:post.url' style='color: #fff; background: #009999; text-decoration: none; border: 1px solid #009999; padding: 3px; border-radius: 3px;font-family: arial, verdana, sans-serif; font-size: 13px; line-height: 20px;' target='_blank' title='Share to Digg'>Digg</a>
<a expr:href='"http://www.linkedin.com/cws/share?url=" + data:post.url' style='color: #fff; background: #00477D; text-decoration: none; border: 1px solid #00477D; padding: 3px; border-radius: 3px;font-family: arial, verdana, sans-serif; font-size: 13px; line-height: 20px;' target='_blank' title='Share to Linkedin'>Linkedin</a>
</div>
</b:if>
<!-- Horizontal social buttons End -->
- Setelah itu, tempelkan Kode diatas Kode <div id='related-posts'> (semua Template Maskolis pasti ada Kode tersebut.)
Demikian Artikel dari saya, semoga bermanfaat.
Note :
Jika bagian atasnya terlalu tinggi keatas, sobat bisa ganti kode yang berwarna merah dengan 5px.
