Membuat Iklan Adsense Responsive Di Blogger Amp Html
Cara semoga iklan AMP responsive full width di halaman AMP blogspot
Inovasi AdSense untuk publisher AMP HTML semakin baik. Beberapa waktu yang lalu, aku mendapat notifikasi untuk mengaktifkan iklan responsive khusus halaman AMP HTML.
Iklan responsif dianggap sanggup meningkatkan nilai klik pada sebuah iklan website. Untuk itulah, menciptakan sebuah iklan responsive sangatlah penting bagi sebuah website. Namun dikala aku ingin mengaktifkan dan menempatkan arahan AdSense yang diberikan dari dashboard Google AdSense, ada duduk kasus alasannya yakni aku memakai platform Blogger. Kode tersebut tidak diterima oleh halaman blogger.
Akhirnya aku coba mempelajari arahan tersebut, dan menemukan alternatif untuk memasang arahan tersebut.
Namun, ada duduk kasus lain dikala mencoba mengaktifkannya. Halaman blog aku justru rusak dan iklan malah tidak responsif.
Ternyata masalahnya, arahan iklan AMP responsive tersebut hanya sanggup diterima dan terbaca dengan baik di tampilan mobile. Dan tanggapan duduk kasus ini yakni mengakalinya dengan memakai tag conditional Blogger.
Cara Membuat Iklan AdSense Responsif untuk Blogger AMP
Dibawah ini yakni pola arahan yang diberikan Google di dashboard AdSense:
<amp-ad width="100vw" height=320 type="adsense" data-ad-client="ca-pub-1234567890004" data-ad-slot="123456789" data-auto-format="rspv" data-full-width> <div overflow></div></amp-ad> Kode di atas tidak diterima di halaman xml Blogger.com, jadi aku coba mengkonversinya menjadi menyerupai di bawah ini:
Agar tampilan iklan bekerja dengan baik baik di dekstop dan tampilan mobile, silahkan gunakan arahan iklan AMP di bawah ini:
<amp-ad data-ad-client='ca-pub-1234567890004' data-ad-slot='123456789' data-auto-format='rspv' data-full-width='' height='320' media='(max-width: 736px)' type='adsense' width='100vw'> <div overflow=''/> </amp-ad> Agar tampilan iklan bekerja dengan baik baik di dekstop dan tampilan mobile, silahkan gunakan arahan iklan AMP di bawah ini:
<b:if cond='data:blog.isMobileRequest == "false" and not data:blog.searchQuery'>
<!-- desktop -->
<amp-ad data-ad-client='ca-pub-1234567890004'
data-ad-slot='123456789'
height='250' layout='fixed-height' type='adsense'>
</b:if>
<b:if cond='data:blog.isMobileRequest == "true" and not data:blog.searchQuery'>
<!-- AMP/mobile -->
<amp-ad data-ad-client='ca-pub-1234567890004'
data-ad-slot='123456789'
data-auto-format='rspv' data-full-width='' height='320' media='(max-width: 736px)' type='adsense' width='100vw'>
<div overflow=''/>
</amp-ad>
</b:if>
Silahkan copy arahan diatas, dan tempatkan iklan responsif AMP tersebut sesuai yang anda inginkan. Jangan lupa untuk mengganti ad-client dan ad-slot sesuai iklan AdSense anda.
Semoga berkhasiat :)
