Iklan Billboard 970x250

Tips Agar Gambar di Postingan Blog Valid AMP

Iklan 728x90

Tips Agar Gambar di Postingan Blog Valid AMP

Cara Supaya Gambar di Postingan Blog Valid AMP (Accelerated Mobile Pages) - Mengupload sebuah gambar di postingan blog supaya valid AMP memerlukan perubahan kode secara manual.

Perubahan kode sendiri berguna untuk membuat gambar tidak memiliki eror sama sekali saat melakukan validasi maupun di Google Search Console. Jika postingan tidak valid AMP makan blog tersebut tidak akan menampilkan simbol petir (Simbol AMP) di halaman mesin pencari Google.

Cara agar supaya gambar yang di upload kedalam artikel blog valid amp.

Cara Supaya Gambar di Postingan Blog Valid AMP


Gambar yang diupload secara default akan terlihat di HTML kira-kira seperti ini:

<div class="separator" style="clear: both; text-align: center;">
<img alt="alt gambar" border="0" src="https://3.bp.blogspot.com/-v1-eNxBF5W4/WDwrdRGK3JI/AAAAAAAAARA/sAIx0LyRTU4kZ5OJjP0NdYamnCia5jl0ACLcB/s1600/valid-amp.jpg" title="title gambar" /></div>

Dan silahkan kamu ganti seperti ini:

<noscript>
<img alt="alt gambar" width="650" height="350" src="LINK-GAMBAR" title="title gambar" />
</noscript>

Yang mana cara ini supaya gambar disisipkan di luar postingan, atau bisa juga digunakan sebagai Thumbnail pada sebuah artikel.

Bagaimana menyisipkan gambar sebagai pendukung di dalam artikel?
Telah saya sebutkan diatas bahwa gambar yang disisipkan secara defaul akan terlihat seperti kode paling atas dibagian HTML.

Silahkan kamu ganti seperti dibawah ini:

<amp-img data-original-height="278" data-original-width="476" height="186" src="LINK-GAMBAR" width="320" layout="responsive"></amp-img>

Sebagai catatan:
layout="responsive" ditambahkan agar lebar serta tinggi gambar dapat menyesuaikan dengan layar gadget yang digunakan oleh pengunjung.

Itulah tutorial singkat mengenai cara supaya gambar postingan blog valid amp dari saya. Semoga bermanfaat.
Baca Juga
SHARE
Abe
For question or business inquiries kindly send me an e-mail at abemail.info@gmail.com. Thank you.

Related Posts

Subscribe to get free updates

Post a Comment

Iklan Tengah Post