Membuat Iklan Adsense Valid AMP HTML
Dibaca
السَّلاَÙ…ُ عَÙ„َÙŠْÙƒُÙ…ْ ÙˆَرَØْÙ…َØ©ُ اللهِ ÙˆَبَرَÙƒَاتُÙ‡ُ
Hallo Sobat, kali ini saya akan memposting Cara Membuat Iklan Adsense Valid AMP HTML. Sebelumnya, apakah sobat sudah tau apa itu AMP HTML? AMP (Accelerated Mobile Pages) adalah sebuah open source project dengan tujuan untuk membuat pengguna seluler saat mengunjungi sebuah situs menjadi lebih cepat. Biasanya blog AMP ditandai dengan lambang (⚡) saat pengunjung (pengguna seluler) melakukan pencarian di mesin pencari Google.
Halaman/Laman AMP biasa ditulis dalam HTML AMP, yang mirip dengan HTML biasa dengan beberapa pembatasan demi kinerja yang handal dan beberapa ekstensi untuk membangun konten yang lebih cepat dari HTML biasa. Itu artinya unit iklan AMP membutuhkan tag iklan yang berbeda dari kode iklan AdSense biasa.
Nah, sekarang sobat sudah tau kan apa itu AMP HTML? Baik kita lanjutkan cara membuatnya yaitu :
Membuat Unit Iklan Responsive Terlebih Dahulu
Sobat harus membuat unit Iklan Responsive di akun AdSense Sobat dan simpan di notepad atau text editor lainnya. Perhatikan dua baris kode yang saya beri garis bawah dibawah ini:
<script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
<ins class="adsbygoogle"
style="display:block"
data-ad-client="ca-pub-9616788184127075"
data-ad-slot="7197470924"
data-ad-format="auto"></ins>
<script>
(adsbygoogle = window.adsbygoogle || []).push({});
</script>
Membuat Unit Iklan Adsense Valid AMP
Sobat bisa memilih antara dua tipe kode iklan AMP, tergantung apakah Sobat ingin menempatkan unit iklan AMP di bagian atas atau di bagian bawah.1. Iklan Bagian Atas
Untuk penempatan iklan di bagian atas, Google merekomendasikan Sobat untuk menggunakan unit iklan AMP dengan tinggi tetap. Untuk hasil terbaik, tetapkan tinggi unit iklan pada nilai 100px dan buat lebar menjadi responsif sehingga dapat menyesuaikan dengan lebar blog Sobat.Untuk membuat unit iklan Adsense Valid AMP dengan tinggi tetap 100 piksel, ganti kode data-ad-client dan data-ad-slot dengan kode iklan Sobat sendiri yang sudah Sobat simpan di notepad seperti yang sudah saya jelaskan diatas.
<amp-ad
layout="fixed-height"
height=100
type="adsense"
data-ad-client="ca-pub-9616788184127075"
data-ad-slot="7197470924">
</amp-ad>
2. Iklan Bagian Bawah
Untuk menempatkan iklan di bagian bawah, Google merekomendasikan Sobat untuk menggunakan unit iklan AMP responsive dengan ukuran 300×250. Menggunakan opsi tata letak responsive AMP berarti unit iklan Sobat akan secara otomatis mengubah ukuran sesuai dengan ukuran perangkat yang digunakan untuk menampilkan iklan.Untuk membuat unit iklan AMP responsive dengan ukuran 300×250, ganti kode data-ad-client dan data-ad-slot dengan kode iklan Sobat sendiri seperti cara sebelumnya.
<amp-ad
layout="responsive"
width=300
height=250
type="adsense"
data-ad-client="ca-pub-9616788184127075"
data-ad-slot="7197470924">
</amp-ad>
Jika Sobat ingin membuat unit iklan yang berbeda sesuai dengan keinginan Sobat sendiri, Sobat bisa membaca paduan membuat iklan AMP DISINI.
Menempatkan Kode Iklan di Blog AMP
Salin dan tempelkan kode iklan AMP ke kode sumber HTML di tempat Sobat ingin menampilkan iklan. Jangan lupa bahwa kebijakan program AdSense masih berlaku untuk laman yang berisi unit iklan AMP.Setelah menempatkan kode iklan AMP, sebaiknya uji iklan di beberapa perangkat seluler yang berbeda untuk memastikan bahwa iklan berfungsi dengan baik di blog AMP Sobat . Biasanya iklan yang baru dipasang di blog AMP akan muncul setelah 5-10 menit.
Menambahkan Skrip AMP Kedalam Template Blog
Agar iklan muncul di blog AMP Sobat, tambahkan kode script AMP dibawah ini, dan tempelkan di bawah tag<head> atau diatas tag
</head> pada template blog Sobat .
<script async custom-element="amp-ad" src="https://cdn.ampproject.org/v0/amp-ad-0.1.js"></script>
Untuk pengguna WordPress Sobat hanya perlu meng-install plugin, dan plugin yang saya pakai adalah: Ads Into Post Sobat bisa download DISINI. Plugin ini akan menampilkan iklan AMP di blog WordPress Sobat.