Site and learn your application

Sabtu, 15 Agustus 2015

Cara Memasang Iklan di Tengah Artikel dan Menyatu Dengan Tulisan

Indo Amaterasu
Ini merupakan kelanjutan dari artikel sebelumnya yaitu "Cara Memasang Iklan di Tengah Postingan Artikel Tanpda Merusak Gambar". Namun yang bibahas kali ini bagaimana cara memasang iklan di tengah artikel tetapi tulisannya menyatu dengan iklan. Nantinya iklan yang dipasang pada halaman postingan, disamping kiri atau kanan iklan ada tulisannya.

Kelebihan merapkan iklan menyatu dengan tulisan, postingan artikel terlihat lebih rapi. Syarat menggunakan cara ini letak iklan harus berada di samping kanan atau kiri, kalau ditengah maka teks tidak menyatu.
Cara Memasang Iklan di Tengah Artikel dan Menyatu Dengan Tulisan
Dibuat Menggunakan MS. Word

Baca:
Cara Memasang Iklan Ditengah Postingan Artikel Tanpa Merusak Gambar
Cara Memasang Iklan AdSense Disamping Artikel Menyatu Dengan Tulisan
Cara Memasang Iklan di Bawah Judul Artikel

Kode HTML yang digunakan masih sama dari cara sebelumnya, hanya perlu ditambahkan kode <div style='float:left; margin-right:15px;margin-bottom:15px'>...</div>. Lebih jelasanya simak tutorial berikut ini.

Cara Memasang Iklan di Tenga Artikel dan Menyatu Dengan Tulisan:

1. Login ke akun Blogger dan pilih Template > Edit HTML
2. Cari kode berikut ini <data:post.body/>
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<data:post.body/>
</b:if>
Catatan:  pada umunya <data:post.body/> ada 3, pilih yang ke-2. Namun bila blog Anda ada auto readmore pilih yan ke-3.

3. Tambahkan <div id='jobmiddlenew'> di atas kode <b:if cond='data:blog.pageType == &quot;item&quot;'> dan kode </div> di bawahnya. Sehingga semuanya menjadi seperti ini:
<div id='jobmiddlenew'><b:if cond='data:blog.pageType == &quot;item&quot;'><data:post.body/></b:if></div>
4. Langkah selanjutnya cari kode </body>, dan letakkan kode di bawah ini di atasnya
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<style>
#addcodemiddle{display: none;}
</style>
<div id='addcodemiddle'>
<div style='float:left; margin-right:15px;margin-bottom:15px'>Letakkan kode iklan yang telah diparse di sini</div></div>
<script type='text/javascript'>
var str1=document.getElementById(&quot;jobmiddlenew&quot;).innerHTML;
var str2=str1.length;
var str3=str2/2;
var substr = str1.substring(str3, str2);
var n = substr.search(&quot;&lt;br&gt;&quot;);
if(n&lt;0)
{
n = substr.indexOf(&#39;.&#39;);
if(n&lt;0)
{
n=0;
}
var firsthalf = str1.substring(0, str3+n+1);
var secondhalf = str1.substring(str3+n+1, str2);
}
else
{
var firsthalf = str1.substring(0, str3+n+4);
var secondhalf = str1.substring(str3+n+4, str2);
}
var addcode=&quot;<center>&quot;+document.getElementById(&quot;addcodemiddle&quot;).innerHTML+&quot;</center><br/>&quot;;
var newbody=firsthalf+addcode+secondhalf;
var strnew=document.getElementsByClassName(&quot;post-body entry-content&quot;);
strnew[0].innerHTML=newbody;
document.getElementById(&quot;addcodemiddle&quot;).innerHTML=&quot;&quot;;
</script>
</b:if> 
5. Simpan dan lihat hasilnya
6. Bila ingin menempatkan disamping kanan/ kiri artikel tinggal merupah  float:left.

2 komentar:

  1. Izin berkunjung dan nyimak artikelnya gan??

    BalasHapus
    Balasan
    1. Monggo gan, disimak sambil minum kopi ya hehe

      Hapus

= > Silahkan berkomentar sesuai artikel di atas
= > Berkomentar dengan url (mati/ hidup) tidak akan dipublish