Cara Mengatur Posisi Iklan di Bawah Judul Artikel

Suatu hari salah satu sahabat blogger, admin Asik Pedia, memberikan komentar tentang unit iklan di bawah judul artikel yang terlalu mepet dengan tulisan. Menurutnya, memang tidak ada masalah pada tampilan mobile, namun tidak enak dilihat pada tampilan dekstop, Ia mengusulkan untuk diperbaiki.

Setelah saya perhatikan, memang benar apa yang dia katakan. Saya pun menyambut baik usulan tersebut.

Sayangnya setelah melihat pengaturan unit iklan tersebut pada edit HTML, saya tidak tahu apa yang harus dilakukan. Karena memang seperti itulah adanya cara meletakkan iklan di bawah judul artikel yang saya tahu.

Haruskah saya copot saja unit iklan tersebut? Tapi jika melihat laporan adsense, posisi tersebut lebih tinggi BPKnya dibanding yang lain. Berhubung pengunjung blog kebanyakan lewat mobile, akhirnya saya biarkan iklan tersebut apa adanya. Bukannya tidak menghargai usul yang diberikan, hanya saja, saya tidak tahu cara memperbaikinya.

Selain itu saya yakin maksud usulannya bukan untuk menghapus unit iklan, tapi hanya memperbaiki posisinya. Hanya saja ilmu saya belum sampai.

Beberapa hari kemudian saya sedang mengedit tampilan iklan di blog yang lain. Saya pun juga berencana menambahkan unit iklan di bawah judul artikel. Walaupun sering melakukannya, saya tidak hapal kodenya. Tapi caranya mudah saja, tinggal ketik di Google, sudah banyak yang menulisnya.

Saya membuka artikel paling atas yang muncul dan menemukan kode yang biasa saya gunakan. Tapi ada sedikit perbedaan, di sini ada kata "margin". Saya pun memakai kode tersebut dan hasilnya ada jarak antara tulisan artikel dengan iklan.

Seperti moment eureka, ini rupanya cara mengatasi unit iklan yang mepet dengan tulisan artikel seperti yang diusulkan seorang teman kemarin.

Bagi yang belum tahu, caranya adalah sebagai berikut:

Cara Meletakkan Iklan di Bawah Judul Artikel

Secara umum caranya adalah sebagai berikut.

Sebelum bisa dimasukkan ke template blog, kode iklan harus diparse terlebih dahulu. Saya biasanya memparse melalui blogcrowds.

Kemudian lakukan pengaturan di blogger.

Buka Beranda Blogger

Pilh Tema

Pilih Edit HTML

Tekan Ctrl F

Cari <data:post.body/>

Letakkan kode berikut di atasnya

<div>
Kode iklan yang sudah diparse
</div>

Kode di atas bisa dipakai terutama untuk iklan yang responsive. Tidak perlu ada pengaturan khusus.

Cara Mengatur Posisi Iklan di Bawah Judul Artikel

Ada pun unit iklan yang ukurannya tidak responsive, kadang posisinya ingin diletakkan di kiri, tengah, atau kanan.

Jika posisinya di tengah, maka kodenya adalah sebagai berikut,

<div style="text-align: center;">
Kode iklan yang sudah diparse
</div>

Jika posisinya di sebelah kiri, maka kodenya menjadi,

<div style="float: left; margin-bottom: 10px; margin-right: 10px;">
Kode iklan yang sudah diparse
</div>

Dan jika posisinya di kanan, kodenya menjadi,

<div style="float: right; margin-bottom: 10px; margin-left: 10px;">
Kode iklan yang sudah diparse
</div>

Untuk nilai margin bisa diganti sesuai dengan keinginan.

Untuk blog dengan template yang baru, alias belum pernah diotak-atik, mencari kode di HTML di edit HTML adalah mudah. Namun untuk template yang terlalu sering dimodifikasi, apalagi oleh orang yang ilmunya pas-pasan seperti saya, perlu kode khusus untuk menandai perubahan yang telah saya lakukan.

Saya sempat bingung dengan banyaknya kode iklan di dalam template. Sudah lupa, ini kode yang mana, posisi mana. Oleh karenanya di atas iklan yang ditambahkan bisa diberi kode seperti ini.

<!-- iklan di bawah judul -->

Tulisan tersebut akan lebih mudah dipahami oleh manusia biasa seperti saya.

Demikianlah cara mengatur posisi iklan di bawah judul artikel berdasarkan pengalaman saya. Saya ucapkan juga terima kasih kepada admin Asik Pedia atas usulannya, sehingga artikel ini bisa dituli. Salam blogger.

Baca Juga