setelah usut punya usut, metode pemasangan iklan seperti itu mirip dengan metode Pengujian A/B.
Namun disini yang membedakan yaitu ukuran iklan adsense bisa kita sesuaikan sesuai keinginan kita sendiri dengan lebih dari dua jenis ukuran iklan.
Trend pemasangan iklan adsense seperti ini saya rasa untuk mengimbangi visitor yang rata-rata banyak menggunakan perangkat mobile gadget, namun apabila ada visitor yang menggunakan desktop, penerapan iklan ini juga masih bisa ditampilkan dengan baik. sehingga menurut saya metode ini cukup layak untuk dipergunakan, karena lebih flexsibel pada perangkat apapun yang digunakan oleh pengunjung blog kita.
Kronologi
Tujuan awal saya untuk memasang iklan dengan berbagai model ini adalah berawal pada keinginan saya yang ingin memasang kode unit iklan adsense dengan ukuran lebih besar, yang rencananya akan saya letakkan di bawah artikel. ukuran iklan tersebut ingin saya buat dengan ukuran kurang lebih 600x300.namun yang menjadi kendala, apabila ada seorang pengunjung blog yang menggunakan mobile gadget, maka tampilan iklan dengan ukuran 600x300 tersebut akan tidak responsif, karena unit iklan yang saya buat tersebut bukan dalam kategori unit iklan responsif. jadi solusinya adalah menggunakan tehnik ini. tehnik ini saya pelajari dari blog mas gani yang merujuk pada blog kompi ajaib. di blog mas gani tersebut, panduan-nya lebih lengkap, karena juga disediakan untuk pemasangan pada blogspot dan wordpress.. namun setelah saya coba pada blogspot saya, iklan tidak menampilkan apa-apa. setelah cek dan ricek, ternyata mas gani mungkin lupa memberikan tanda pada class CSS-nya. entah itu disebabkan karakter template yang saya gunakan atau masalah lain, saya juga belum menguji pada template jenis lain-nya.
Bila anda ingin menerapkan metode iklan responsive layaknya metode Pengujian A/B, anda bisa mencoba uraian yang saya bahas dibawah ini :
Langkah Satu
Buatlah kode unit iklan adsense dengan ukuran custom, sesuaikan dengan lebar body blog sampean. disini saya menggunakan dimensi 600x300, anda bisa mencoba dengan ukuran 600x280.. atau mungkin bisa lebih, semua menyesuaikan lebar blog anda.setelah itu copast code iklan-nya ke notepad. kurang lebihnya seperti ini jika kita membuat dimensi iklan 600x300, lalu tambahkan class CSS nya, seperti dibawah yang saya beri tanda biru:
<!-- medium_banner_600x300 -->
<ins class="adsbygoogle .ads_respo"
style="display:inline-block;width:600px;height:300px"
data-ad-client="ca-pub-xxx"
data-ad-slot="xxx"></ins>
<script>
(adsbygoogle = window.adsbygoogle || []).push({});
</script>
Langkah Kedua
Masuk ke menu Template >> HTML pada dashboard blogspot, lalu copast code CSS ini diatas tag ]]></b:skin>. setelah itu simpan konfigurasinya.
.ads_respo { width: 336px; height: 280px; } @media (max-width:450px) { .ads_respo { width: 300px; height: 250px; } } @media (min-width:500px) { .ads_respo { width: 336px; height: 280px; } } @media (min-width:800px) { .ads_respo { width: 600px; height: 300px; } }
Langkah Ketiga
Setelah menambahkan kode CSS diatas, selanjutnya meletakkan unit iklan adsense.. bisa anda parse di HTML Parser biar tidak terjadi error disaat menyimpan.
untuk peletakan kode iklan di template, saya rasa anda sudah bisa mencari tahu letaknya kan..?!
Dari sini langkah pemasangan iklan multi unit responsive selesai. untuk mencoba melihat hasil-nya, bisa anda lihat menggunakan mobile gadget dan mengakses blog tersebut.
Jika benar, nanti tampilan iklan adsense akan berubah-ubah sesuai kondisi perangkat akses-nya juga menyesuaikan slot iklan yang tersedia. sampel nya seperti dibawah ini (berbeda ukuran)
Catatan
- Pada kode CSS diatas, anda bisa menyesuaikan dimensi iklan yang ingin anda modifikasi atau mungkin juga menambahkan ukuran yang lain. tapi jika anda ingin iklan adsense juga tampil dengan baik pada tiap tiap jenis perangkat pengakses, maka kode diatas jangan dihapus, namun tambahi saja dengan kode iklan dengan ukuran lainnya.
- Dan pada tanda angka yang berwarna merah (600x300), ganti dan sesuaikan dengan ukuran iklan adsense yang sudah anda buat secara custom seperti langkah pertama.
Semoga bermanfaat.
Credit untuk Klikmania dan Kompi Ajaib