Memasang Widget Facebook Like Page Terbaru di Blog

Banyak Blogger bertanya soal error trouble memasang widget Facebook Like Page terbaru versinya, bernama Facebook Page Plugin, untuk format blog di blogger.com (blogspot.com), karena berubahnya coding yang disediakan oleh Facebook Developers (developers.facebook.com), yang diforum-forum lokal/internasional belum ditemukan solusinya yang 'ngena', akhirnya penulis tertarik untuk melakukan 'investigasi' sendiri, dan memang khususnya format blogspot, coding dari Facebook ternyata keliru! 

Tapi untuk investigasi dalam format website non-blog, penulis belum mencobanya... lagipula persoalan yang diangkat khan di format blogspot :) penulis cuma penasaran kenapa bisa terjadi begitu? Web penulis sih masih pakai FB Like Page yang tersedia di versi pendahulunya, mungkin nanti dicoba juga :)

To the point..! Disini tidak akan dibahas bagaimana cara mendapat coding untuk Like Page dimaksud, karena jika blogger mengalami kesulitan untuk pasang widget tsb di blog-nya, diasumsikan sudah tahu cara memperoleh coding Facebook-nya.

Contoh coding yang diberikan oleh Facebook Developers (Page-nya page mereka sendiri) nanti ya sesuaikan dengan page blogger masing-masing lah: 

Step-1: Copy dulu struktur coding no. 2, lalu Paste ke pilihan widget blogspot (Add Gadget di Layout / Tata Letak), selesai Save.

Step-2: Copy isi struktur coding yang no. 1

Step-3: Akses bagian Template blogspot, lalu Edit HTML

Step-4: Paste struktur coding yang tadi diCopy (struktur no.2), pada baris sebelum (diatas) </body>

Step-5: Tadaaa!!! Pasti muncul notifikasi error (tulisan warna merah) dari sistem blogspotnya!

Kesalahannya dimana???

Disini...

Step-6: Copy coding yang benar buatan penulis berikut ini (gantikan yang error)

Step-7: Ya, Paste coding modifikasi oleh penulis ke posisi baris Template blogspot yang lagi dibuka. Atau sesuaikan saja dengan mengganti pas letak kekeliruannya.

Step-8: Ya, Save lah alias Simpan template-nya...

Step-9: Seharusnya sudah tidak ada lagi notifikasi error dari sistem (seperti yang sudah dipraktekkan sendiri).

Step-10: View Blog (Lihat Blog).

Step-11: Kalo udah OKe... ngopih yuk, jangan lupa snack-nya!!!

Inilah struktur codingnya yang udah dimodif penulis:

<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/en_US/sdk.js#xfbml=1&amp;version=v2.3";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>

*Catatan Kaki:

1)   Jika ada value codingnya seperti itu, memang unacceptable juga untuk format website, tapi nanti kalo penulis sempet ya ngopreknya di web yanz4ever.pw, baru kasih konfirmasi :)
2)  Jadi kekurangan/kekeliruannya: value 1 menyebutkan file xml a-la FB Developers (xfbml) yang dipanggil, lalu disertai keterangan tipe versinya, tapi lupa bahwa cantuman & harus diikuti oleh amp (simbol & pada coding termasuk HTML) sehingga harusnya &amp lalu diikuti dengan keterangan versi harus diberikan pembatas berupa tanda ; barulah menginput version.
3)  Jadi seharusnya ~ xfbml=1&amp;version=v2.3"; ~ sementara coding dari FB Developers: ~ xfbml=1&version=v2.3" ~

Kelihatan sepele dan cuma segitu ya? Tapi dalam urusan coding... it does matter! Ya, sesuai pengalaman penulis berkutat dengan yang begituan. Jadi, kekurangannya adalah karakter code amp dan ; (semicolon atau titik-koma)

“Dear FB Developers, are you paying attention to this?” (bertanya dalam hati sambil ngunyah sirih :) )

*updated note: yet somehow those strings just worked fine for standard web (non blogging platform)