Cara Memasang Widget Iklan Teks Mirip Google Adsense

Apa maksud dari mirip google adsense tersebut? ini karena efek yang dimunculkan dari widget ini memang mirip dengan iklan google adsense ketika di hover ke salah satu iklannya, maka muncul isi dari iklan dengan efek yang halus, efek ini sangat nyaman dilihat dan kodenya pun cukup ringan untuk di pasang di blog.

1. Login ke blog > Buka Template > Salin kode di bawah ini sebelum ]]></b:skin>atau </style>

/* Iklan Teks Google Adsense */
.iklan-teks{position:relative;margin:0;padding:10px;max-height:300px;overflow:hidden}.iklan-teks div{position:relative;background:#FFF;height:120px;padding:8px 0;margin:0;z-index:1;color:#555}.iklan-teks h2.iklan-header{position:relative;background:#FFF;font-size:18px;color:#0f7dc8;border-top:1px solid #d8d8d8;border-radius:0;padding:8px 0;margin:0;text-transform:none;cursor:pointer}.iklan-teks h2.iklan-header:first-child{border-top:0}.iklan-teks h2.iklan-header:before{content:"";width:0;height:0;position:absolute;top:20px;right:15px;border:5px solid transparent;border-color:#b2b2b2 transparent transparent;cursor:pointer}.isi-iklan span.judul-iklan{font-size:18px;color:#0f7dc8;display:inline-block;cursor:pointer}.isi-iklan span.url-iklan{font-size:12px;color:#0f7dc8;display:block;margin:8px 0;cursor:pointer}.isi-iklan span.url-iklan:before{content:"\f0c0";font-family:FontAwesome;margin:0 10px 0 0}.isi-iklan span.panah-besar{color:#fff;background:#e74c3c;border-radius:50%;height:34px;float:right;width:34px;text-align:center;line-height:34px;cursor:pointer;transition:all .6s}.isi-iklan span.panah-besar:before{content:"\f054";font-family:FontAwesome;margin:0 0 0 3px;font-size:20px}.isi-iklan span.panah-besar:hover{background:#34495e;color:#fff}.isi-iklan p.isi{padding:0;margin:0 40px 0 0;color:#555;font-size:12px;text-align:left}

2. Kemudian salin kode di bawah ini sebelum </body>

<script type='text/javascript'>
//<![CDATA[
(function(a){a.fn.hoverTimeout=function(c,e,b,d){return this.each(function(){var f=null,g=a(this);g.hover(function(){clearTimeout(f);f=setTimeout(function(){e.call(g)},c)},function(){clearTimeout(f);f=setTimeout(function(){d.call(g)},b)})})}})(jQuery);(function(b){b.fn.iklanaccordion=function(a){a=jQuery.extend({active:1,hovertimeout:300,sUpSpeed:500,sDownSpeed:500,sUpEasing:null,sDownEasing:null},a);return this.each(function(){var g=b(this),h=g.children("div[data-header]"),f=a.active-1;h.each(function(){b(this).hide().before('<h2 class="iklan-header">'+b(this).data("header")+"</h2>")});g.children("div:eq("+f+")").show().prev().css("margin-top","-47px").addClass("active");g.find(".iklan-header").hoverTimeout(a.hovertimeout,function(){g.children("h2").removeClass("active").animate({marginTop:0});h.slideUp(a.sUpSpeed,a.sUpEasing).animate({marginTop:-47});b(this).addClass("active").next().slideDown(a.sDownSpeed,a.sDownEasing)})})}})(jQuery);$(function(){$(".iklan-teks-sidebar").iklanaccordion();$(".iklan-teks-post-footer").iklanaccordion()});$(".info-icon").hover(function(){$(".info-iklan").animate({right:0},500,"easeInOutExpo")},function(){$(".info-iklan").animate({right:-103},500,"easeInOutExpo")});
//]]>
</script>

*Setelah terpasang, simpan template.

3. Buka tata letak > Buat widget baru > Kemudian tambahkan kode di bawah ini didalamnya

<div class='iklan-teks iklan-teks-sidebar' id='iklan-teks'>
    <!-- iklan ke 1 -->
    <div data-header="Pasang Iklan Disini">
      <span class='isi-iklan'>
<span class='judul-iklan' onclick="window.open('/');">Pasang Iklan Disini</span>
      <span class='url-iklan' onclick="window.open('/');">url web kalian</span>
      <span class='panah-besar' onclick="window.open('/');"></span>
      <p class='isi'>Pasang Iklan Website Anda Disini</p>
      </span>
    </div>
    <!-- iklan ke 2 -->
    <div data-header="Pasang Iklan Disini">
      <span class='isi-iklan'>
<span class='judul-iklan' onclick="window.open('/');">Pasang Iklan Disini</span>
      <span class='url-iklan' onclick="window.open('/');">url web kalian</span>
      <span class='panah-besar' onclick="window.open('/');"></span>
      <p class='isi'>Pasang Iklan Website Anda Disini</p>
      </span>
    </div>
    <!-- iklan ke 3 -->
    <div data-header="Pasang Iklan Disini">
      <span class='isi-iklan'>
<span class='judul-iklan' onclick="window.open('/');">Pasang Iklan Disini</span>
      <span class='url-iklan' onclick="window.open('/');">url web kalian</span>
      <span class='panah-besar' onclick="window.open('/');"></span>
      <p class='isi'>Pasang Iklan Website Anda Disini</p>
      </span>
    </div>
    <!-- iklan ke 4 -->
    <div data-header="Pasang Iklan Disini">
      <span class='isi-iklan'>
<span class='judul-iklan' onclick="window.open('/');">Pasang Iklan Disini</span>
      <span class='url-iklan' onclick="window.open('/');">url web kalian</span>
      <span class='panah-besar' onclick="window.open('/');"></span>
      <p class='isi'>Pasang Iklan Website Anda Disini</p>
      </span>
    </div>
    <!-- iklan ke 5 -->
    <div data-header="Pasang Iklan Disini">
      <span class='isi-iklan'>
<span class='judul-iklan' onclick="window.open('/');">Pasang Iklan Disini</span>
      <span class='url-iklan' onclick="window.open('/');">url web kalian</span>
      <span class='panah-besar' onclick="window.open('/');"></span>
      <p class='isi'>Pasang Iklan Website Anda Disini</p>
      </span>
    </div>
  </div>

4. Simpan widget dan lihat hasilnya.

Dan ini untuk versi lebih sederhananya. Tambahkan kode di bawah ini di dalam widget

<div id='blogsoftlikasi_ppc'>
    <a style="text-decoration: underline; padding: 15; font-size: 12px; color:blue;" href="http://www.blog.softlikasi.com" target="_blank" title="Iklan Teks Murah"><strong>Iklan Teks Murah</strong></a>
    <br />
    <span style="font-size:11px">Hanya Rp.60.000/bulan, Pasang Iklan Teks Anda Disini Sekarang Juga!</span>
    <br />
    <a style="font-size: 9px;color:#b0130d;" href="http://www.blog.softlikasi.com" target="_blank" title="Iklan Teks Murah">http://www.blog.softlikasi.com</a>    <br/>
    <br/>
    <a style="text-decoration: underline; padding: 15; font-size: 12px; color:blue;" href="http://www.blog.softlikasi.com" target="_blank" title="Iklan Teks Murah"><strong>Iklan Teks Murah</strong></a>
    <br />
    <span style="font-size:11px">Hanya Rp.60.000/bulan, Pasang Iklan Teks Anda Disini Sekarang Juga!</span>
    <br />
    <a style="font-size: 9px;color:#b0130d;" href="http://www.blog.softlikasi.com" target="_blank" title="Iklan Teks Murah">http://www.blog.softlikasi.com</a>
    <br/>
    <br/>
    <a style="text-decoration: underline; padding: 15; font-size: 12px; color:blue;" href="http://www.blog.softlikasi.com" target="_blank" title="Iklan Teks Murah"><strong>Iklan Teks Murah</strong></a>
    <br />
    <span style="font-size:11px">Hanya Rp.60.000/bulan, Pasang Iklan Teks Anda Disini Sekarang Juga!</span>
    <br />
    <a style="font-size: 9px;color:#b0130d;" href="http://www.blog.softlikasi.com/" target="_blank" title="Blogg Softlikasi">http://www.blog.softlikasi.com</a>
    <br/>
    <br/>
    <a style="text-decoration:none;padding:15;font-size:12px;float:right;color:#b0130d;" href="http://www.blog.softlikasi.com" target="_blank" title="Pasang Iklan Murah diBlog Softlikasi"><small>Ads by Blog Softlikasi</small></a>
    <br />
</div>