Wednesday, January 18, 2012

Cara memasang 8 kolom iklan 125x125 di Blogspot

Buat Mas Bos yang nyari duit sambil ngeblog alias nyari pendapatan tambahan dari Iklan, Afliasi Program, PTC, Backlink dan sejenisnya, saya akan berikan tips gimana caranya meamasang 8 kolom iklan 125x125 dibawah header blog Mas Bos, wow keren banget... Berani mencobanya...?

 Langsung seperti biasa ikuti langkah - langkah dibawah ini :

1. Login ke blogspot, lalu Mas Bos masuk ke halaman Layout/Tata letak blog Mas Bos dan klik Edit Html ( sebelumnya backup dulu template anda dengan cara mengklik Download full template, jadi template Mas Bos yang lama langsung tersimpan ).

2. Langkah pertama Mas Bos copy kode dibawah ini :


<div id='sidebar-ads'>
<div class='ads-sidebar'>
<center><ul>
<li><a href='mailto:tutor2605@gmail.com' target='_blank'><img border='0' height='125' src='http://i306.photobucket.com/albums/nn252/cebong_ipit/banner-ifoell.png' width='125'/></a></li>
<li><a href='mailto:tutor2605@gmail.com' target='_blank'><img border='0' height='125' src='http://i306.photobucket.com/albums/nn252/cebong_ipit/banner-ifoell.png' width='125'/></a></li>
<li><a href='mailto:tutor2605@gmail.com' target='_blank'><img border='0' height='125' src='http://i306.photobucket.com/albums/nn252/cebong_ipit/banner-ifoell.png' width='125'/></a></li>
<li><a href='mailto:tutor2605@gmail.com' target='_blank'><img border='0' height='125' src='http://i306.photobucket.com/albums/nn252/cebong_ipit/banner-ifoell.png' width='125'/></a></li>
<li><a href='mailto:tutor2605@gmail.com' target='_blank'><img border='0' height='125' src='http://i306.photobucket.com/albums/nn252/cebong_ipit/banner-ifoell.png' width='125'/></a></li>
<li><a href='mailto:tutor2605@gmail.com' target='_blank'><img border='0' height='125' src='http://i306.photobucket.com/albums/nn252/cebong_ipit/banner-ifoell.png' width='125'/></a></li>
<li><a href='mailto:tutor2605@gmail.com' target='_blank'><img border='0' height='125' src='http://i306.photobucket.com/albums/nn252/cebong_ipit/banner-ifoell.png' width='125'/></a></li>
<li><a href='mailto:tutor2605@gmail.com' target='_blank'><img border='0' height='125' src='http://i306.photobucket.com/albums/nn252/cebong_ipit/banner-ifoell.png' width='125'/></a></li>
</ul></center>
</div>
</div>

Catatan : Ganti tulisan berwarna merah diatas dengan alamat Surel / Email Mas Bos.

3. Kemudian paste di atas <div id='main-wrapper'> atau <div id='main-wrap1'><div id='main-wrap2'> kalau template Mas Bos 3 kolom, tentunya terdapat id=main, ada sidebar lagi, Mas Bos paste di atas ini <div id='side-wrapper1'> atau sejenisnya yang nantinya/pada intinya berada di bawah header blog Mas Bos  jadi tergantung template Mas Bos karena masing-masing template berbeda kode Html nya,

4. Langkah selanjutnya Mas Bos copy kode dibawah ini :


#sidebar-ads {
width:970px;
margin-bottom:5px;
float:right;
background:#fff;
padding:10px;
}
.ads-sidebar{float:left; margin:0pt; padding:0pt}

#sidebar-ads ul li ul{list-style-type:square; margin-left:1.5em; padding:0; border:0}
#sidebar-ads ul li ul li{border:0}
#sidebar-ads .ads-sidebar ul{background:transparent none repeat scroll 0% 50%; border:1px solid transparent; float:left; margin:0pt; padding:10px 0pt 10px 2px; width:970px}
#sidebar-ads .ads-sidebar ul li{display:inline; list-style-type:none; margin:0pt; padding:0pt}
#sidebar-ads .ads-sidebar ul li a:hover{border-bottom:none; list-style-type:none}

.ads-sidebar ul{margin:0px; padding:0px}
.ads-sidebar ul li a{float:left}
.ads-sidebar img{margin:0px 0px 5px 5px; border:1px solid #CCC; padding:2px}
.ads-sidebar img:hover{border:1px solid #999}



Nach... Di sini lebar Width tergantung template masing-masing (Mas Bos tinggal rubah sesuai dengan lebar template Mas Bos), demikian juga margins dan pading, menurut selera Mas Bos sendiri tentunya.

5. Dan paste lagi di atas ]]></b:skin>

6. Klik SAVE/Simpan dan lihat hasil nya ....

Semoga bermanfaat... (",)

No comments:

Post a Comment