Tutorial Cara Memasang Tombol Like Facebook, Twitter dan Google Plus

Tutorial Cara Memasang Tombol Like Facebook, Twitter dan Google + Di Blog

Selamat berjumpa kembali dengan maswardi dalam dalam rangka tutorial membuat blog. Pada kesempatan kali ini, saya akan menulis bagaimana mempercantik blog dengan cara memasang tombol Tweet, Like Facebook dan Google Plus di bawah postingan. Tulisan tentang tutorial cara membuat tombol Tweet, Google + dan tombol like Facebook ini saya kutip dari mainbom.com.

Tutorial cara membuat tombol Tweet, Google + dan Like Facebook:

1. Login ke Blogger > Template > Edit HTML
2. Sebagai backup sebaiknya download dulu template Anda.
3. Centang Expand Template Widget
4. Cari kode <data:post.body/> jika di Blog Anda ada beberapa kode tersebut, pilih kode yang kedua.
5. Simpan kode berikut ini setelah kode <data:post.body/> atau jika anda ingin memasang tombol Tweet, Google + dan tombol like Facebook di atas postingan, simpan kodenya sebelum <data:post.body/>

<div style='float:left;width:80px'>
<a class='twitter-share-button' href='https://twitter.com/share'>Tweet</a>
<script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0];if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src=&quot;//platform.twitter.com/widgets.js&quot;;fjs.parentNode.insertBefore(js,fjs);}}(document,&quot;script&quot;,&quot;twitter-wjs&quot;);</script></div>
<div style='float:left;padding-left:10px;width:60px'>
<g:plusone size='medium'/></div>
<div style='float:left;padding-left:10px;width:90px'>
<iframe allowTransparency='true' expr:src='&quot;http://www.facebook.com/plugins/like.php?href=&quot; + data:post.url + &quot;&amp;layout=button_count&amp;show_faces=false&amp;width=90&amp;action=like&amp;font=arial&amp;colorscheme=light&quot;' frameborder='0' height='20' scrolling='no' style='border:none;overflow:hidden; '/></div>

6.  Save template dan lihat hasilnya.

Catatan:

- Jika tombol Google + tidak muncul, copy kode <script type="text/javascript" src="https://apis.google.com/js/plusone.js"></script> di atas kode </head>

- Jika tombol Tweet, Google + dan Like tidak ingin ditampilkan di halaman Home atau hanya ingin ditampilkan di halaman postingan saja, cukup tambahkan kode <b:if cond='data:blog.pageType == &quot;item&quot;'> dan </b:if> diantara kode tombol tadi. Dan hasilnya menjadi seperti ini:

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

< Kode tombol Tweet, Google + dan Like Facebook >
</b:if>

Ditulis oleh Mas Wardi, Minggu, 20 Mei 2012 - Rating: 4.5

Judul : Tutorial Cara Memasang Tombol Like Facebook, Twitter dan Google Plus
Deskripsi : Tutorial Cara Memasang Tombol Like Facebook, Twitter dan Google + Di Blog Selamat berjumpa kembali...

Bagikan ke

Facebook Google+ Twitter