Mengatasi AdSense Responsive Tidak Bekerja di Template Responsif

Author : Sigit Purnomo | Released : August 12, 2017 | Category :
Mengatasi AdSense Responsive Tidak Bekerja di Template Responsive - Google Adsense mendukung berbagai ukuran banner dan link / tautan untuk iklannya. Termasuk iklan responsive yang disiapkan khusus untuk situs / blog yang memiliki desain responsive.

Blog responsive diciptakan untuk menyesuaikan tampilan blog yang fleksibel, dapat disesuaikan di berbagai ukuran layar, termasuk desktop, tablet, dan mobile.

Saat ini sudah banyak sekali template responsive untuk situs blogspot / blogger, ataupun yang mengandalkan wordpress. Bisa juga dengan memanfaatkan Bootstrap untuk website dengan HTML sederhana.

Iklan Google Responsive

Iklan Google Responsive

Dengan memasang script dari google adsense berjenis responsive di blog yang telah menggunakan template responsive, maka besar / lebar banner tersebut akan berubah-ubah, disesuaikan dengan lebar layar.

Namun ada saatnya dimana iklan responsive yang kita pasang tidak muncul seperti seharusnya. Tentu ini menjadi sebuah tanda tanya untuk kita. Kangsigit.com pernah menguji coba di blog lain untuk jenis adsense responsive ini, dan problem pun terjadi.

Usut punya usut, saya mencoba beberapa cara untuk membuatnya work dengan menambahkan CSS di template, dan usaha saya tidak sia-sia. Saya berfikir logika, Adsense mencari CSS pada bidang yang akan dimasukkan iklan, apabila CSS tidak ditemukan, dan atau muncul tapi telat, maka iklan tidak dapat merespon dengan benar. Hasilnya, besar iklan yang muncul bisa jauh lebih besar dari yang diharapkan.

Mengapa CSS tidak segera terbaca sebelum iklan mulai terpasang?

Barangkali Anda telah mengikuti petunjuk / saran dari webmaster google?
Seperti halnya saya. Saya bekerja keras mengompres semua file yang akan di download, dibaca dan dinikmati setiap orang. Termasuk menjadikan sumber script menjadi asyncronous.

Misalnya:
<script async='' src='file.js'></script>

Nah, setelah melakukan itu, pasti google juga menyarankan kita untuk mengatur CSS agar tidak menunda perenderan laman-laman web kita.
Saya melakukan hal yang hampir sama dengan asinkron di javascript, yakni dengan kode berikut:
<script>
var links = document.createElement('link');
links.href = 'file.css';
links.rel = 'stylesheet';
document.getElementsByTagName('head')[0].appendChild(links);
</script>

Kode diatas akan meload (file.css) untuk blog kita. Dengan itu maka perenderan laman utama tidak akan tertunda. Namun karena kode diatas juga, kode iklan untuk jenis Responsive menjadi tidak bekerja.

Kadang google lebih dulu menyangka bahwa kerangka blog kita tidak di atur lebarnya, sehingga dia akan meletakkan slot yang super lebar, sehingga kita harus menggulir laman kesamping untuk melihat iklan full, dan tampilan blog menjadi kacau.

Pemecahan Masalah

Jika penyebab masalahnya adalah hal demikian, maka kita harus mau "sedikit repot". Silahkan Anda cari semua CSS utama untuk kerangka blog Anda di berbagai jenis layar.

Contohnya, jika Anda menggunakan template dari Bootstrap, tambahkan CSS ini diatas </head>
<style>
@media (min-width: 1200px) {
.container {
width: 1170px;
}
}
@media (min-width: 992px) {
.container {
width: 970px;
}
}
@media (min-width: 768px) {
.container {
width: 750px;
}
}
</style>

Jika kalian butuh bantuan lebih jauh, silahkan tulis pertanyaan di komentar. Saya akan berusaha semampu saya membantu tampilan blog Anda menjadi responsive untuk iklan Google.

Google+

Linkedin

Silahkan berkomentar sesuai topik yang dibahas