Memasang Komentar Facebook Pada Blog AMP HTML

Pada waktu yang lalu saya sudah membagikan tutorial tentang Mengatur Gambar Postingan Blog AMP HTML Agar Lebih Rapih. Dan pada kesempatan kali ini saya akan mencoba membagikan artikel tentang Memasang Komentar Facebook Pada Blog AMP HTML. Sementara ini sistem komentar yang valid AMP baru dua sistem komentar. Yang pertama komentar disqus, dan sekarang blogger memilih komentar Facebook yang di suport untuk valid AMP HTML.

Nah, bagi Anda yang ingin mencoba Memasang Komentar Facebook Pada Blog AMP HTML Anda, mari ikuti caranya di bawah ini.
Baca juga Cara Memasang Komentar Disqus Untuk Blog AMP HTML

Yang pertama silahkan coppy kode berikut.


            <b:includable id='fb-comment' var='post'>
<div class='fb-comments' id='fb_comments'>
<amp-facebook-comments data-colorscheme='dark' data-numposts='5' expr:data-href='data:post.url' height='180' layout='responsive' width='600'>
</amp-facebook-comments>
</div>
            </b:includable>

Disini Anda bisa mengganti warna background komentarnya, jika background blog Anda light atau terang, silahkan hapus kode data-colorscheme='dark'

Setelah itu silahkan simpan kode HTML tadi di bawah kode berikut:


<b:includable id='comments' var='post'>
............
............
............
</b:includable>

Sehingga tampilan kodenya akan seperti berikut:


<b:includable id='comments' var='post'>
............
............
............
</b:includable>
            <b:includable id='fb-comment' var='post'>
<div class='fb-comments' id='fb_comments'>
<amp-facebook-comments data-colorscheme='dark' data-numposts='5' expr:data-href='data:post.url' height='180' layout='responsive' width='600'>
</amp-facebook-comments>
</div>
            </b:includable>

Kemudian silahkan copy kode dibawah ini.


<b:include cond='data:blog.pageType == &quot;item&quot;' data='post' name='fb-comment'/>

Dan simpan tepat di bawah kode berikut:


<b:include data='post' name='post'/>

Kemudian silahkan simpan kode meta di bawah ini di atas kode </head>


<meta content='xxxxxxxxxxxxxxx' property='fb:admins'/>
<meta content='xxxxxxxxxxxxxxx' property='fb:profile_id'/>

Silahkan ganti xxxxxxxxxxxxxxx untuk fb:admins dengan ID profile Facebook Anda dan xxxxxxxxxxxxxxx untuk fb:profile_id dengan ID fans page blog Anda.

Dan yang terakhir silahkan simpan kode berikut di atas kode </head>


<b:if cond='data:blog.pageType == &quot;item&quot;'>
<script async='async' custom-element='amp-facebook-comments' src='https://cdn.ampproject.org/v0/amp-facebook-comments-0.1.js'/>
</b:if>

Sekarang silahkan Anda cek komentar Facebook di salah satu postingan blog Anda. Jika Anda mengikuti cara di atas dengan benar, maka seharusnya komentar facebook akan tampil dengan normal.

Nah, mungkin cuma itu saja yang bisa saya bagikan tentang Memasang Komentar Facebook Pada Blog AMP HTML. Untuk artikel tentang AMP HTML lainya anda bisa membaca Membuat Spoiler Untuk Blog AMP HTML Dengan AMP-Accordion. Selamat mencoba.

Reaksi:
Share this with short URL:

You Might Also Like:

How to style text in Disqus comments:
  • 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 Hide Parser