Ditulis oleh: Ditulis pada: 10/03/2014
Widget HTML5 Facebook Tidak Berjalan - Sebenarnya ini baru saya sadari setelah saya bersih-bersih HTML template blog untuk menyingkirkan beberapa jquery yang kurang penting untuk mengurangi beban loading blog.
Namun saya tersadar bahwa tombol like and share facebook yang saya pasang jadi tidak muncul. Pikir saya mungkin ada kode yang terhapus, namun setelah saya cek ulang, kode-kode widget fb aman-aman saja.
Kemudian saking penasaran, saya coba juga cek demo-demo widget yang pernah saya buat di JSFiddle, dan ternyata tombol-tombol Facebook-nya juga tidak muncul.
Kemudian saya coba cek langsung ke halaman Facebook Developers barangkali ada kode yang berubah untuk option HTML5. Kemudian saya coba lagi kode widget HTML5 dari FB Developers tersebut di JSFiddle, namun masih juga error alias tidak muncul. Namun ketika saya coba menggunakan iframe, ternyata widgetnya berjalan seperti biasanya.
Kemudian saya coba juga cek blog-blog sahabat, ternyata yang menggunakan widget FB HTML5 pun sama tidak muncul. Jadi saya simpulkan untuk saat ini awal Oktober 2014, widget HTML5 Facebook error! Sementara ini sepertinya belum ada penjelasan dari pihak Facebook-nya mengenai error widget HTML5 ini. Atau ini mungkin hanya terjadi pada browser saya? Untuk itu saya tunggu informasinya dari sahabat Kompi Ajaib.
Nah jika Anda juga mengalami hal yang sama seperti saya, untuk mengatasi hal ini silahkan hapus kode-kode widget HTML5 FB dan ganti dengan menggunakan iframe. Jika Anda tidak ingin iframe-nya terdetek agar tidak mengurangi nilai SEO blog, maka silahkan gunakan jquery iframe loader.
Untuk tombol like dan sharing Facebook di halaman postingan, kode-kodenya seperti di bawah ini.
Kode HTML
<div class='fb-like loader' expr:data-src='"http://www.facebook.com/plugins/like.php?href=" + data:post.url + "&amp;width=90&amp;layout=button_count&amp;action=like&amp;show_faces=false&amp;share=true&amp;height=21"'></div>Kode Javascript
Simpan di atas kode
</body>
<script type='text/javascript'>
//<![CDATA[
setTimeout(function(){$(".fb-like").each(function(){$(this).replaceWith('<iframe class="fb-like loader" src="'+$(this).data("src")+'" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:130px; height:21px;" allowTransparency="true"></iframe>')})},50);
//]]>
</script>
Untuk Like Box Facebook di sidebar
Kode HTML
<div class='fb-likebox loader' data-src="//www.facebook.com/plugins/likebox.php?href=https%3A%2F%2Fwww.facebook.com%2Fkompiajaib&width=300&height=258&colorscheme=light&show_faces=true&header=false&stream=false&show_border=false"></div>
Silahkan ganti kode
kompiajaib dengan user name page fb Anda.Kode Javascript
<script type='text/javascript'>
//<![CDATA[
setTimeout(function(){$(".fb-likebox").each(function(){$(this).replaceWith('<iframe class="fb-likebox loader" src="'+$(this).data("src")+'" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:300px; height:258px;" allowTransparency="true"></iframe>')})},50);
//]]>
</script>