Membuat Kotak Iklan di Sidebar

Assalamualikum,

Kali ini saya akan membuat artikel tentang Cara Membuat Kotak Iklan di Sidebar Blog

kotak iklan ini terdapat 4 kotak iklan, dan tidak banyak juga CSS yang digunakan,

kita langsung saja ke intinya.

Sebelum ke inti artikel ini. Baca dulu ini.

Buat kalian yang menggunakan template buatanya Arlina Design, biasanya CSSnya sudah ada, jadi kalian bisa langsung ke point no. 5

ok, berikut caranya.

Cara Membuat Kotak Iklan pada Sidebar

1. Login ke Blogger kalian
2. klik Template > Edit HTML
3. Tambhakan Script CSS dibawah ini, tambahkan sebelum kode </style>

.kotak_iklan {margin:auto;transition:all 1s ease-out;}
.kotak_iklan .sidebar .widget-content,.kotak_iklan .sidebar-two .widget-content{padding:0;border:0;}
.kotak_iklan .sidebar .widget {margin-bottom:0;padding:0;}
.kotak_iklan img{background:#fff;text-align:center;margin:5px 2.5px;padding:2.5px;border:1px solid #ddd!important;transition:all .6s ease-out}
.kotak_iklan  img:hover {background:#fff;border-color:#bbb!important;}
.kotak_iklan2 {text-align:center;margin:0 auto;transition:all 1s ease-out;}
.kotak_iklan2 .sidebar .widget-content,.kotak_iklan2 .sidebar-two .widget-content{padding:0;background:#f2f6f7;box-shadow:0 1px 2px 0 rgba(0,0,0,0.1);border:0;}
.kotak_iklan2 .sidebar .widget,.kotak_iklan2 .sidebar-two .widget {margin-bottom:0;padding:0;}
.kotak_iklan2  img {text-align:center;transition:all 1s ease-out;}
.kotak_iklan2  img:hover {transition:all .5s ease-out;}
.kotak_iklan3 {position:relative;margin:0 auto;}

4. jika sudah, Simpan > Tata Letak > Tambahkan Widget > HTML/Javascript
5. Masukkan Script dibawah ini. Simpan

<div class="kotak_iklan">
<a href="http://abdurrahim-id.blogspot.com/" title="Abdurrahim ID" target="_blank"><img class="noborder" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiKsvIBKUvlfs9foTo49GVpfQVPnoum39c8atZ3G5I4qbyd0veraL2TFVYpN20sCX3uhpxcsJC79dYvi3TPIABLf7jADPw59K4trMegrkxahirWR5IrNl-yuBj3fcUu8h711gj8cjg7om4/s1600/Abdurrahim+ID.png" alt="3xploi7" width="125" height="125" /></a>
<a href="url iklan yang dituju" title="judul iklan"><img class="noborder" src="http://1.bp.blogspot.com/-AzY4b7aWefY/VXoZ6aD1m3I/AAAAAAAACac/jY9906KnHSs/s1600/125x125.jpg" alt="alt gambar" width="125" height="125" /></a>
<a href="url iklan yang dituju" title="judul iklan"><img class="noborder" src="http://1.bp.blogspot.com/-AzY4b7aWefY/VXoZ6aD1m3I/AAAAAAAACac/jY9906KnHSs/s1600/125x125.jpg" alt="alt gambar" width="125" height="125" /></a> 
<a href="url iklan yang dituju" title="judul iklan"><img class="noborder" src="http://1.bp.blogspot.com/-AzY4b7aWefY/VXoZ6aD1m3I/AAAAAAAACac/jY9906KnHSs/s1600/125x125.jpg" alt="alt gambar" width="125" height="125" /></a> 
</div>

Jika, kalian mengalami masalah silahkan komen dibawah.