Cara Membuat Tombol Like Facebook pada Blogger

• Share on Twitter
• Share on Facebook

Mungkin sudah ada sangat banyak yang memposting/membuat tutorial seputar cara membuat tombol Like atau tombol Suka Facebook pada Blogger. Yah, meskipun sudah banyak, Saya juga berhak memposting juga dong, he.

ilustrasi : http://marketingland.com/

Karena ini merupakan pengalaman saya Pribadi. Kita asumsikan di sini Kita akan membuat tombol suka/like pada Sidebar Blogger. Masuk ke blogger kemudian ke menu pengaturan layout blogger. Tambahkan Gadget baru dan pilih "HTML/JavaScript"

HTML/JavaScript

Masukan kode JavaScript dibawah ini :

1 2 3 4 5 6 7 8

<div id="fb-root"></div> <script>(function(d, s, id) { var js, fjs = d.getElementsByTagName(s)[0]; if (d.getElementById(id)) return; js = d.createElement(s); js.id = id; js.src = "//connect.facebook.net/id_ID/sdk.js#xfbml=1&version=v2.0"; fjs.parentNode.insertBefore(js, fjs); }(document, 'script', 'facebook-jssdk'));</script>

Nahh, tepat dibawah kode tersebut, masukan lagi kode HTML ini :

1	<div class="fb-like" data-href="https://www.facebook.com/ajarin.net" data-width="150" data-layout="standard" data-action="like" data-show-faces="true" data-share="false"></div>

Edit kode tulisan yang mempunyai latar berwarna merah dan biru, yang berlatar merah sesuaikan dengan link page facebook Anda, kemudian yang berwarna biru tentu lebar dari plugin ini. 

Untuk lebar sendiri, sesuaikan dengan berapa lebar sidebar blog tempat Anda menaruh plugin ini. untuk melihat berapa lebar sidebar blog, bisa dilihat pada pengaturan template, kemudian pilih "Customize". Dan akhirnya, bagaimana tampilan blog Anda sekarang? apakah sudah berhasil memasang plugin like facebook ini? semoga saja berhasil. Jika berhasil, tampilannya akan tampak seperti ini :

Jika sahabat ajarin TIDAK ingin ada foto dibagian tombol suka, bisa juga kok. dengan mengedit HTML data-show-faces="true" menjadi data-show-faces="false" sehingga kode HTML nya seperti ini :

1	<div class="fb-like" data-href="https://www.facebook.com/ajarin.net" data-width="150" data-layout="standard" data-action="like" data-show-faces="false" data-share="false"></div>

Maka hasilnya akan tampak seperti ini :

Alhamdulillah, sekian dulu ya tutorial sederhana ini, jika sahabat ajarin ingin membaca postingan seputar bagaimana caranya membuat tombol share di blogger.
http://www.ajarin.net/2014/11/membuat-tombol-share-facebook-di-blogger.html