Gambar thumbnail blog adalah gambar yang ditampilkan pada beranda maupun widget-widget tertentu agar cuplikan dari artikel atau postingan blog kelihatan lebih menarik.
Masalahnya adalah tag img ini tidak bisa di pakai pada blog dengan template AMP, dan harus di ganti tag amp-img agar valid AMP.
Baca: Cara Posting Gambar agar Valid AMP
Dan tentu saja karena tidak ada tag img pada sebuah postingan maka tidak ada gambar thumbnail yang bisa ditampilkan, atau gambar thumbnail yang tampil adalah gambar default thumbnail saja.
Untuk memperbaiki gambar thumbnail post yang tidak muncul pada template AMP caranya adalah dengan menggunakan tag img yang diletakkan di dalam tag noscript.
Misalnya kita ingin menampilkan gambar thumbnail dengan url berikut ini:
Maka Anda harus menambahan tag noscript seperti ini:
Dengan meletakkan tag img menggunakan tag noscript ini, maka tag img akan tetap terdeteksi dan dapat menampilkan thumbnail serta tetap valid AMP.
Masalahnya adalah tag img ini tidak bisa di pakai pada blog dengan template AMP, dan harus di ganti tag amp-img agar valid AMP.
Baca: Cara Posting Gambar agar Valid AMP
Dan tentu saja karena tidak ada tag img pada sebuah postingan maka tidak ada gambar thumbnail yang bisa ditampilkan, atau gambar thumbnail yang tampil adalah gambar default thumbnail saja.
Untuk memperbaiki gambar thumbnail post yang tidak muncul pada template AMP caranya adalah dengan menggunakan tag img yang diletakkan di dalam tag noscript.
Misalnya kita ingin menampilkan gambar thumbnail dengan url berikut ini:
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgqFdNnMiAJRpnDE6ZTaAf1gGS_juyllO9i3D2hHNQvX5XJJCV9AXGt0viPtEfaQQuPR6kcS4y1xLlQlHI4nxauuTKlxtknHeSbd8FqtFsbjrxMtuLXR8aNagXIonUbSCiOBvItI4V65enk/s1600/tumbnail-amp-blog.jpgMaka Anda harus menambahan tag noscript seperti ini:
<noscript>
<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgqFdNnMiAJRpnDE6ZTaAf1gGS_juyllO9i3D2hHNQvX5XJJCV9AXGt0viPtEfaQQuPR6kcS4y1xLlQlHI4nxauuTKlxtknHeSbd8FqtFsbjrxMtuLXR8aNagXIonUbSCiOBvItI4V65enk/s1600/tumbnail-amp-blog.jpg"/>
</noscript>
Dengan meletakkan tag img menggunakan tag noscript ini, maka tag img akan tetap terdeteksi dan dapat menampilkan thumbnail serta tetap valid AMP.