Friday 27 November 2009

Cara menambah kolom SIDEBAR ADS di template Blogspot

Bagikan Artikel ini :

Bagi sobat yang sudah tau cara menambah kolom SIDEBAR ADS ditemplate blogspot tentu gak asing lagi dengan triks yang satu ini, namun bagi sobat yang masih Newbie seperti saya kalau mau menambahkan sidebar ads ini,sobat bisa mencoba seperti yang saya coba di blog saya ini.caranya seperti dibawah ini.






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

2. Lalu sobat copy kode dibawah ini

<div id='sidebar-ads'>
<div class='ads-sidebar'>
<center><ul>
<li><a href='mailto:roni_m02@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:roni_m02@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>

3. Kemudian paste di atas <div id='sidebar-wrapper'>

4. Dan copy kode dibawah ini

#sidebar-ads {
width:300px;
margin-bottom:10px;
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:300px}
#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 8px; border:1px solid #CCC; padding:2px}
.ads-sidebar img:hover{border:1px solid #999}

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

6. Klik SAVE ( Simpan pengaturan )

......

Silahkan Gunakan Facebook Comment, Jika Anda Tidak Memiliki Url Blog!

Comments for blogger! Ingin Kotak Komentar seperti ini? KLIK DISINI!?

0 comments:

Post a Comment