Cara Menampilkan Fanpage Facebook Valid AMP HTML

Widget Fanpage Facebook memang bisa mempercantik tampilan blog kita, tapi kita sendiri tau bahwa menampilkan widget fanpage facebook cukup memberatkan loading blog kita, Namun setelah adanya support facebook plugin untuk AMP, saya rasa hal ini mempermudah kita untuk memasang widget tersebut di blog kita tanpa terlalu mempengaruhi loading blog. Bisa dibilang ringan dan simpel.

Banyak teman-teman blogger yang meminta saya, bagaimana cara menampilkan Widget Fanpage Facebook tapi yang valid AMP HTML. Sebenarnya banyak cara sih menampilkan widget tersebut, tapi kali ini saya akan memberikan contoh yang sederhana, mudah dan valid AMP HTML.

Oke, langsung saja, sobat Hendra Surya harus memasang javascript dari AMP dulu.

<script async='async' custom-element='amp-facebook-page' src='https://cdn.ampproject.org/v0/amp-facebook-page-0.1.js'></script>

Letakkan kode tersebut di </head> atau  &lt;/head&gt;&lt;!--<head/>--&gt;

Gunakan kode di bawah ini untuk menampilkan widget fanpage facebook anda

<amp-facebook-page width="300" height="250"

    layout="responsive"

    data-show-facepile="true"

    data-href="https://www.facebook.com/hendrasuryadotcom/">

</amp-facebook-page>

Silahkan letakkan kode tersebut di layout atau tata letak blog anda, cukup mudah kan ?

DEMO

Lihat di sidebar kanan

width="300" height="250" Sesuaikan dengan ukuran layout sidebar anda

https://www.facebook.com/hendrasuryadotcom/ Ganti dengan alamat Fanpage Facebook Anda

Nah sekian dulu tutorial Cara Menampilkan Fanpage Facebook Valid AMP HTML Selamat Mencoba sobat Hendra Surya, jika ada kesulitan, silahkan ditanyakan di kolom komentar.

Sumber : https://www.ampproject.org/docs/reference/components/amp-facebook-page