Lompat ke konten Lompat ke sidebar Lompat ke footer
Beranda / AMP Tutorial

Cara Memunculkan Thumbnail Pada Amp Html Blogger Template

Tutorial Cara Memunculkan Thumbnail Pada AMP HTML Blogger Template

Saya memakai template AMP blogger dan mengubah semua artikel termasuk instruksi <img> jadi <amp-img>, tapi kok thumbnailnya tidak muncul? Kenapa ya?

 Ternyata memang template blogger tidak akan membaca thumbnail kalau semua image pada sebuah artikel diubah menjadi instruksi <amp-img>.

Sebagaimana kita ketahui, bahwa tag img pada AMP HTML bermetamorfosis amp-img. Apabila kita menuliskan pada postingan menyerupai ini :
<img alt='gambar' src='url-image'/>
maka akan menjadikan error validasi AMP HTML. Penulisan yang benar menyerupai disini yakni :
<amp-img src="url-image-disini.png"
    width="1080"
    height="610"
    layout="responsive"
    alt=" Tutorial Cara Memunculkan Thumbnail Pada AMP HTML Blogger Template Cara Memunculkan Thumbnail Pada AMP HTML Blogger Template"></amp-img>
Image akan muncul dengan baik pada postingan. Akan tetapi tidak akan muncul pada thumbnail di halaman utama / homepage. Untuk mengakalinya, biar image muncul pada Homepage tambahkan tag noscript sehingga instruksi menjadi menyerupai ini :

<noscript><img alt='gambar' src='url-gambar-anda'/></noscript>

Selamat mencoba...

Demikianlah Artikel Tutorial Cara Memunculkan Thumbnail pada AMP HTML Blogger Template. Semoga menjadi solusi dari "kebingungan" anda :D

Anda mungkin menyukai postingan ini :