Friday, September 7, 2018

Tutorial Memasang Iklan AdSense amp-ad di AMP Blogger

    Tutorial Lengkap Cara Memasukan Iklan AdSense pada Template AMP Blogger

    AdSense merupakan salah satu jaringan iklan untuk publisher yang paling banyak digunakan oleh para pemilik website. Produk dari Google ini memang menjadi pilihan utama bagi para webmaster untuk memonitize websitenya. 

    Google AdSense support hampir disemua bahasa pemograman, termasuk untuk website yang berbasis Google AMP HTML. Namun, untuk menempatkan iklan AdSense pada AMP, diperlukan kode yang berbeda, sesuai pedoman dari AMP HTML.

    Kali ini saya akan menjelaskan beberapa penerapan iklan AdSense pada AMP Blogger, beserta pilihan Layout untuk amp-ad.

    Namun sebelum melakukan penerapan amp-ad pada Blogger, pastikan anda sudah meletakan komponen amp-ad di bawah ini, sebelum kode </head> pada template AMP Blogger anda.

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


    Responsive

    Contoh kode iklan amp-ad responsive untuk Adsense:

    
    <amp-ad width="100vw" height="320"
      type="adsense"
    
      data-ad-client="ca-pub-1234567891234567"
      data-ad-slot="1234567890"
      data-auto-format="rspv"
      data-full-width=''>
        <div overflow=''></div> </amp-ad>

    Contoh di atas adalah untuk penerapan iklan AdSense dengan dimensi responsive, di mana tinggi maksimal dari iklan adalah 320 piksel. 

    atribut width='100vw' artinya iklan akan mengisi keseluruhan ruang pada container, termasuk mengisi margin. Untuk itulah, iklan AdSense responsive ini jangan ditanam pada parent div atau container agar iklan tampil optimal. Jika container anda memiliki margin:0, itu sama saja dengan width='100%'.  

    Fixed-Height Ad


    Contoh kode iklan fixed-height amp-ad seperti  contoh di bawah ini:

    
    <amp ad layout='fixed-height'
      data-ad-client="ca-pub-1234567891234567"
      data-ad-slot="1234567890"
      height='250'>
    </amp-ad>

    Iklan layout='fixed-height' ini tidak memerlukan atribut width, di mana lebar iklan akan menyesuaikan format iklan banner yang dipilih. Atribut layout amp-ad ini direkomendasikan untuk kamu yang memilih iklan native AdSense.

    Fixed Ad

    Contoh penerapan iklan dengan Layout Fixed:

    
    <amp ad layout='fixed'
      data-ad-client="ca-pub-1234567891234567"
      data-ad-slot="1234567890"
      height='280' width='336'>
    </amp-ad>


    Layout='fixed' membutuhkan atribut width dan height pada penerapannya. Kode ini digunakan untuk anda yang menggunakan iklan AdSense dengan ukuran tertentu, contoh iklan banner 336X280.


    Kenapa Iklan Saya Tidak Muncul di Blog AMP?

    Google AdSense cukup ketat dalam menayangkan iklan AdSense, berikut ini beberapa alasan kenapa iklan tidak muncul pada AMP Blogger.
    • Iklan AdSense AMP-AD tidak boleh ditempatkan pada parent container yang memiliki position fixed.
    • Jika iklan tidak muncul pada artikel baru, ini wajar. Anda hanya perlu menunggu hingga 10 menit setelah artikel diterbitkan.
    • Iklan ditempatkan pada parent container yang memiliki tinggi tetap (fixed). Hal ini akan membuat iklan merusak layout blog anda, dan iklan tidak akan muncul. 
    • Blog anda tidak disetujui untuk menempatkan iklan AdSense.

    Sebenarnya masih ada beberapa style dan type iklan AdSense yang bisa anda terapkan pada AMP Blogger Template. Antara lain amp auto ads, parallax style, iklan sticky ad, dan lainnya. Silahkan baca artikel di bawah ini:


    Disqus Comments