Gampang Caranya Embed Twitter Post Pada AMP Template

Jika sebelumnya saya sudah menuliskan sebuah tutorial cara embed instagram di amp template, maka berikut ini masih dengan topik yang sama yaitu tentang embed code, namun kali ini yang akan kita embed adalah twitter, cara embed twitter pada halaman postingan amp template tidak jauh berbeda dengan cara embed instagram, hanya saja file atau kode yang perlu di pasang berbeda satu sama lain.

Karena pada embed twitter kali ini kita akan mengambil ID dari url twitter tersebut, sebagai contoh https://twitter.com/antoncabon/status/711382395778367488, seperti yang anda bisa lihat maka kita hanya perlu menyalin kode ID 711382395778367488 yang akan kita gunakan pada data-tweetid.

Berikut langkah-langkah embed twitter pada halaman postingan AMP Template.

1. Salin dan letakan kode berikut ini sebelum tag </head>

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

2. Berikutnya silakan anda salin kode dibawah ini dan letakan pada halaman postingan pada AMP Template anda.

Gunakan kode ini jika anda ingin menampilkan gambar


<amp-twitter width="400"
      height="492"
      layout="responsive"
      data-tweetid="711382395778367488">
  </amp-twitter>

Gunakan kode ini jika anda ingin menyembunyikan gambar


<amp-twitter width="400"
      height="350"
      layout="responsive"
      data-tweetid="711382395778367488"
      data-cards="hidden">
  </amp-twitter>

3. Silahkan ganti data-tweetid 711382395778367488 dengan milik anda sendiri atau data ID tweet yang lainnya.

Hasilnya akan nampak seperti contoh dibawah ini;

MENAMPILKAN GAMBAR




MENYEMBUNYIKAN GAMBAR




Bagaimana mudah bukan selamat mencoba dan semoga berhasil.



You Might Also Like

Comments: