>>Sebelumnya ada teman yang menanyakan cara memasang tombol like di postingan, nah kali ini saya memiliki kesempatan untuk membuat tutorial cara membuat tombol Tweet, Google + dan tombol like Facebook tanpa menggunakan plugin pihak ketiga. Tapi saya sendiri tidak suka sih buat widget kaya gitu di blog ini..Jadi disini kita tidak menggunakan plugin pihak ketiga agar loading blog tidak menjadi berat apabila di tambahkan tombol Tweet, Google + dan tombol Like.
Cara membuat tombol Tweet, Google + dan like tanpa plugin pihak ketiga:
1. Login ke Blogger > Template > Edit HTML
2. Sebelum mengubah kode HTML sebaiknya cadangkan dulu template anda untuk menghindari hal-hal yang tidak diinginkan.
3. Centang
4. Cari kode <data:post.body/> jika di Blog anda ada banyak kode seperti itu, 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/>
code :
6. Save template dan lihat hasilnya.
Note:
- 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 == "item"'> dan </b:if> diantara kode tombol tadi. menjadi seperti ini:
code:
SELESAI DAH..
selamat mencoba.
Cara membuat tombol Tweet, Google + dan like tanpa plugin pihak ketiga:
1. Login ke Blogger > Template > Edit HTML
2. Sebelum mengubah kode HTML sebaiknya cadangkan dulu template anda untuk menghindari hal-hal yang tidak diinginkan.
3. Centang
4. Cari kode <data:post.body/> jika di Blog anda ada banyak kode seperti itu, 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/>
code :
<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="//platform.twitter.com/widgets.js";fjs.parentNode.insertBefore(js,fjs);}}(document,"script","twitter-wjs");</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='"http://www.facebook.com/plugins/like.php?href=" + data:post.url + "&layout=button_count&show_faces=false&width=90&action=like&font=arial&colorscheme=light"' frameborder='0' height='20' scrolling='no' style='border:none;overflow:hidden; '/>
</div>
<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="//platform.twitter.com/widgets.js";fjs.parentNode.insertBefore(js,fjs);}}(document,"script","twitter-wjs");</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='"http://www.facebook.com/plugins/like.php?href=" + data:post.url + "&layout=button_count&show_faces=false&width=90&action=like&font=arial&colorscheme=light"' frameborder='0' height='20' scrolling='no' style='border:none;overflow:hidden; '/>
</div>
6. Save template dan lihat hasilnya.
Note:
- 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 == "item"'> dan </b:if> diantara kode tombol tadi. menjadi seperti ini:
code:
<b:if cond='data:blog.pageType == "item"'>
< Kode tombol Tweet, Google + dan Like... ></b:if>
SELESAI DAH..
selamat mencoba.