Cara Memasang Iklan Adsense Responsive di Samping Kiri Postingan

Salah satu cara meningkatkan CTR dari iklan PPC adsense adalah menempatkan iklan tersebut di dalam postingan blog atau website, lebih-lebih jika diletakkan pada bagian atas samping kiri postingan. Sebab, penempatan iklan seperti itu terlihat strategis baik untuk iklan adsense maupun jenis iklan yang lain yang anda ikuti.

Artikel terkait: Anonymous Ads Alternatif Google Adsense

Seperti yang telah saya tuliskan di atas, pada artikel kali ini saya akan berbagi tips cara memasang iklan adsense di samping kiri postingan. Tepatnya, jika artikel blog dibuka pada device desktop atau smartphone yang sedikit besar maka iklan google adsense akan tampil di bagian atas-kiri postingan. Namun jika artikel dibuka pada ponsel genggam/handphone, maka iklan adsense akan tampil di bagian atas postingan.

Dengan begitu penempatan iklan ideal, strategis dan pastinya lebih responsive. Perhatikan demonya pada gambar di bawah ini.

Tampilan iklan adsense untuk desktop

Tampilan iklan adsense untuk handphone

Cara Memasang Iklan Responsive di Blog

Langkah 1: Ambil script iklan ‘Persegi Panjang Sedang’ (ukuran 300 x 250), contoh scriptnya seperti di bawah ini.

<script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
<!—Iklan adsense 300x250 -->
<ins class="adsbygoogle"
     style="display:inline-block;width:300px;height:250px"
     data-ad-client="ca-pub-212xxxxxxxxxxxx"
     data-ad-slot="007xxxxxxx"></ins>
<script>
(adsbygoogle = window.adsbygoogle || []).push({});
</script>

Langkah 2: Ubah kode tersebut menjadi seperti di bawah ini.

<script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
<!—Iklan adsense 300x250 -->
<ins class=”adsbygoogle” style=”display:block” data-ad-format=”rectangle” data-ad-client=” ca-pub-212xxxxxxxxxxxx” data-ad-slot=”007xxxxxxx”></ins>
<script>
(adsbygoogle = window.adsbygoogle || []).push({});
</script>

Intinya, anda tinggal menambahkan kode data-ad-format=”rectangle” di iklan adsense anda. Selebihnya silahkan sesuaikan dengan script di atas.

Langkah 3: Parse kode iklan yang sudah disesuaikan tersebut dengan Tools Parse HTML.

Langkah 4: Letakkan kode di bawah ini di atas kode <data:post.body/>

<div class='adspost'>
Kode iklan adsense yang telah di parse
</div>

Langkah 5: Jangan lupa menambahkan kode CSS di bawah ini, tepat di atas kode </style> atau </b:skin>

.adspost{margin-right:20px;margin-top:8px;margin-bottom:7px;float:left;display:block;width:300px;height:250px}

Langkah 6: Juga tambahkan kode CSS media screen berikut ini di atas </style> atau </b:skin>

@media screen and (max-width:414px){
.adspost{margin:0 15px !important;float:none;text-align:center;width:auto;height:auto}
}

Langkah 7: Simpan template.

Update: Cara Pasang Iklan Google Adsense yang Benar Tanpa Parse Kode

Demikian cara pemasangan iklan adsense menjadi responsive di dalam postingan. Jika penerapannya berhasil, maka iklan adsense anda akan tampil lentur disegala device, baik desktop, tablet maupun handphone.