Kamis, 23 Desember 2010

Cara Memasang Iklan Google Adsense ditengah Artikel Postingan

Cara memasang iklan google adsense ditengah artikel postingan blog membutuhkan sedikit kode HTML. Berbeda dengan meletakkan iklan dibawah ataupun diatas judul postingan blog yang langsung menyematkan kode parse iklan didalamnya. Kesulitan yang juga merupakan kemudahan platform blogger adalah kebebasan untuk mengedit manual kode didalam templatenya. Dibandingankan dengan wordpress yang dengan plugin langsung selesai, tentunya menggunakan plan bisnis dengan membayar sejumlah uang.

Unit iklan yang disematkan pada tengah postingan dapat berukuran apa saja, bisa 300x250, 336x280 dan responsive ataupun mobile banner 320x100 untuk tampilan mobile dengan tipe  (teks / gambar) sesuka kamu. Walaupun sendiri google adsense menyediakan unit iklan "in-article" yang merupakan iklan responsif yang dapat disematkan dengan ukuran pas ditengah postingan. Tentunya untuk iklan ukuran banner besar 300x600 tidak cocok ditampilkan ditengah postingan blog karena akan memakan tempat pada artikelnya.

Cara Memasang Iklan di tengah Postingan Blog

Selain itu perlu diingat ada baiknya untuk menggunakan kode tag pengkondisian <b:if cond='...' blogger untuk menampilan iklan hanya pada postingan saja, beranda saja ataupun menyembunyikannya pada laman statis. Untuk itu langsung saja berikut cara memasang iklan ditengan postingan blog.

Cara Memasang Iklan ditengah Postingan Blog

Langkah 1. Siapkan kode iklan yang akan disematkan, encode kode html iklan pada situs berikut: https://opinionatedgeek.com/Codecs/HtmlEncoder supaya lebih mudah.

Langkah 2. Lihat ke dashboard blogger yaitu Tema >> Edit HTML dan cari kode (crtl+f):
<data:post.body/>
Note:
~ Untuk tampilan desktop kode diatas biasanya dekat dengan kode tag pengkondisian
<b:if cond='data:blog.pageType == &quot;item&quot;'>
~ Untuk tampilan mobile biasanya kode diatas dekat dengan kode
<div class='post-body entry-content' expr:id='&quot;post-body-&quot; + data:post.id' itemprop='articleBody'>

Langkah 3. Ganti kode di langkah 2 dengan kode dibawah berikut dan letakkan hasil kode parse html iklan sesuai dengan rincian:
<div expr:id='&quot;post1&quot; + data:post.id'/>
<div class='googlepublisherads' style='margin:20px 0'>
<center>
--Letakkan hasil encode parse kode adsense disni--
</center>
</div>
<div expr:id='&quot;post2&quot; + data:post.id'><data:post.body/></div>
<script type='text/javascript'>
var obj0=document.getElementById(&quot;post1<data:post.id/>&quot;);
var obj1=document.getElementById(&quot;post2<data:post.id/>&quot;);
var s=obj1.innerHTML;
var t=s.substr(0,s.length/2);
var r=t.lastIndexOf(&quot;&lt;br&gt;&quot;);
if(r&gt;0) {obj0.innerHTML=s.substr(0,r);obj1.innerHTML=s.substr(r+4);}
</script>
Note:
~ Untuk menampilkan iklan di sepertiga postingan blog ganti angka 2 menjadi 3
   Untuk menampilkan iklan di seperempat postingan blog ganti angka 2 menjadi 4.

Langkah 4. Simpan dan selamat iklan sudah muncul ditengah artikel blog. Cara ini juga berlaku untuk Menampilkan Iklan Adsense di Mobile Blog.

Tidak ada komentar:

Posting Komentar