Cara Memasang Video YouTube pada Template AMP

DulBjn

No comments

Template yang sudah valid AMP (Accelerated Mobile Pages) memiliki kecepatan yang luar biasa. Namun demikian, untuk memasang beberapa hal tidak semudah memasang pada template lainnya. Hal itu karena antara kode HTML dan AMP sendiri memiliki perbedaan yang bisa dibilang lumayan. Salah satu perbedaan yang sangat mencolok adalah kode image (gambar). Demikian juga saat memasang video dalam hal ini video YOUTUBE harus memenuhi standar dalam kode AMP sendiri. Maka berikut akan diuraikan cara memasang video youtube pada template AMP dengan benar agar valid dan tidak didapati eror.

Memasang Video Youtube pada Template AMP

Untuk memasang video youtube, template yang anda gunakan harus sudah dipasang terlebih dahulu script amp-youtube. Untuk menyimpan video Youtube pada template valid AMP HTML untuk Blogspot, pada tag <head> harus terdapat script amp-youtube seperti ini :

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

Setelah sudah terpasang script amp-youtube di atas, maka sekarang cara penulisan postingan. Saat Anda memposting atau hendak memasang video youtube di postingan, maka silahkan gunakan kode berikut ini dalam HTML (ukuran video width dan height silahkan disesuaikan) :

  <amp-youtube width="480"
height="270"
layout=responsive
data-videoid="XXXXXXXX">
</amp-youtube>

Kode XXXXXX adalah kode yang didapat dari URL Youtube. Contoh video dengan menerapkan kode di atas, seperti ini :



Layout yang support untuk kode video adalah sebagai berikut fill, fixed, fixed-height, flex-item, nodisplay, responsive

Demikian uraian tentang cara memasang video youtube pada template AMP. Semoga bermanfaat. Silahkan jika ada hal yang belum dipahami, coret-coret saja di kotak komentar yang ada.

Source: https://www.ampproject.org/docs/reference/components/amp-youtube

Tags:

Related Posts

Tinggalkan komentar