Ditulis oleh: Ditulis pada: 4/11/2021
Memasang Disqus Recommendations Pada Blog AMP HTML - Seperti yang sudah saya bagikan di postingan sebelumnya tentang Disqus Recommendations, bahwa widget recommendations dari Disqus ini sekarang bisa dipasang sendiri tanpa komentar Disqus.
Di postingan sebelumnya, saya bagikan widget Disqus Recommendations untuk blog NON AMP, dan sekarang saya buatkan untuk blog AMP HTML.
Untuk pemasangan widget recommendations dari Disqus pada blog AMP ini menggunakan komponen amp-iframe, jadi jika ingin menggunakannya pastikan di halaman tersebut sudah terpasang JS untuk amp-iframe.
Jika Anda ingin mencobanya, silahkan gunakan kode berikut ini, simpan di mana Anda ingin menampilkan widget-nya.
<amp-iframe noloading="" title="Juga di Kompi Ajaib"
src="https://cdn.statically.io/gh/KompiAjaib/kompi-html/master/disqus-recommendations-2.html?shortname=kompiajaib"
height="240"
layout="fixed-height"
frameborder="0"
sandbox="allow-forms allow-scripts allow-same-origin allow-modals allow-popups">
<amp-img noloading="" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhxMU0q3HBkY-eUZU7ERjLicOw97d2NOwItIxxcbD3x0Ha7xAb1DKEtNKIZhL5wK1_ygEvqlnjDJNtvgPnnEQuea3Dhmi3U0qTFnw4ZAaLV-jzq_mJTyiy85oXrY44JoNLhWMfz4jVChyphenhypheng/s1600/back.png" layout="fixed-height" height="240" width="auto" placeholder=""></amp-img>
</amp-iframe>Ganti kode kompiajaib yang ditandai dengan shortname Disqus blog Anda. Sesuaikan juga untuk kode Juga di Kompi Ajaib dengan nama blog Anda untuk title amp-iframe.
Dan penampakannya akan seperti di bawah ini dengan Live Demo.
Lebar widget akan menyesuaikan dengan lebar tempatnya karena ini sudah responsive dengan tinggi yang tetap. Untuk tampilannya sendiri ada 4 style layout untuk tampilan Disqus Recommendations ini yang bisa di atur dari dashboard Disqus untuk blognya di bagian Recommendations seperti gambar berikut.
Semoga bermanfaat.