Widget HTML5 Facebook Tidak Berjalan

Widget HTML5 Facebook Tidak Berjalan

Bola Hero Gawai

Widget HTML5 Facebook Tidak Berjalan

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.

Widget HTML5 Facebook


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='&quot;http://www.facebook.com/plugins/like.php?href=&quot; + data:post.url + &quot;&amp;amp;width=90&amp;amp;layout=button_count&amp;amp;action=like&amp;amp;show_faces=false&amp;amp;share=true&amp;amp;height=21&quot;'></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&amp;width=300&amp;height=258&amp;colorscheme=light&amp;show_faces=true&amp;header=false&amp;stream=false&amp;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>

Share this:

Share this with short URL: Get Short URL loading short url

You Might Also Like:

Disqus
Blogger
Pilih Sistem Komentar Yang Disukai

0 Comment

Add Comment

Komentar dengan link promo akan masuk spam.

Gunakan konversi tool jika ingin menyertakan kode atau gambar.


image
How to style text in Disqus comments Top Disqus Commentators
  • To write a bold letter please use <strong></strong> or <b></b>.
  • To write a italic letter please use <em></em> or <i></i>.
  • To write a underline letter please use <u></u>.
  • To write a strikethrought letter please use <strike></strike>.
  • To write HTML code, please use <code></code> or <pre></pre> or <pre><code></code></pre>.
    And use parse tool below to easy get the style.
Show Parser Box

How to get ID DISQUS - http://disq.us/p/[ID DISQUS] - lihat di sini

strong em u strike
pre code pre code spoiler
embed

Like Kompi Ajaib? Keep us running by whitelisting Kompi Ajaib in your ad blocker.

This is how to whitelisting Kompi Ajaib in your ad blocker.

Thank you!

×
×
×