Setelah lama tidak mengupload tutorial Blogger, akhirnya saya bisa menulis kembali. Kali ini artikelnya mengenai tutorial Blogger menyisipkan atau embed video YouTube ke dalam postingan Blogger yang tentunya valid AMP.Karena cara embed video dari YouTube di blog AMP berbeda dengan blog non AMP, Sobat tidak bisa langsung meng-copy kode yang dihasilkan YouTube dan menempelkannya ke dalam postingan blog secara langsung seperti di blog non AMP.
Oleh karena itu, Sobat perlu memodifikasi kode embed sesuai dengan dokumentasi yang ada di situs amp.dev dan tentunya supaya tidak ada eror yang terdeteksi.
Cara Embed Video YouTube di Blog AMP
1. Buka Dashboard Blogger Sobat, lalu klik menu Tema > Edit HTML.2. Letakkan script amp-iframe diantara tag head. Untuk memudahkan pencarian, klik Ctrl + F.
lt;script async='async' custom-element='amp-iframe' src='https://cdn.ampproject.org/v0/amp-iframe-0.1.js'></script>3. Setelah selesai, klik Simpan Tema dan kembali ke editor postingan.
4. Lalu, edit postingan yang ingin Sobat embed dengan menggunakan kode di bawah ini. Kode ini sudah responsive, jadi Sobat tidak perlu mengatur lebar videonya.
<amp-iframe allowfullscreen='' frameborder='0' height='270' layout='responsive' sandbox='allow-scripts allow-same-origin allow-popups allow-presentation' allow='autoplay; encrypted-media' src='xxxxxxx' width='480'>
<amp-img height='270' layout='fixed-height' noloading='' placeholder='' src='https://cdn.staticaly.com/img/1.bp.blogspot.com/-x1yVa6ztsWY/WyHFPLG0uLI/AAAAAAAAyIg/3C5Lb5EjGywOPzO_XSwK1XTu6VlBZE4SgCLcBGAs/s1600/back-iframe.png'></amp-img>
</amp-iframe>5. Ganti xxxxxxx dengan url video YouTube yang ingin Sobat embed ke blog. Selesai.
Untuk melihat hasilnya, silakan klik Pratinjau atau di Publikasikan. Dan coba lihat di perangkat yang berbeda, desktop dan mobile.
Terima kasih telah membaca, semoga bermanfaat tutorial embed video YouTube ke blog AMP.
