Langsung saja pada langkah-langkahnya, yaitu sebagai berikut.
Pertama, login ke account blogger hingga masuk Dasbor >> Tata Letak >> Edit HTML
Kedua, temukan kode ]]></b:skin>
Ketiga, buat dan tempatkan kode css berikut ini di atas kode di atas tersebut.
#Kotak-iklan {
margin: 0px;
padding: 5px;
text-align: center;
}
#Kotak-iklan img {
margin: 0px 4px 4px 0px;
padding: 3px;
text-align: center;
border: 1px solid #c0c0c0;
}
#Kotak-iklan img:hover {
margin: 0px 4px 4px 0px;
padding: 3px;
text-align: center;
border: 1px solid #333;
}
Keterangan
Jika menginginkan, kita dapat mengganti warna border dengan kode html warna sesuai keinginan masing-masing. Untuk mengetahui kode warna silakan klik di sini.
Keempat, simpan template
Kelima, masuk (klik) Tata Letak >> Tambah Gadget >> Tambahkan HTML/Javascript
Keenam, ketikkan kode dengan format seperti di bawah ini.
<div id="Kotak-iklan">
<a href="http://heri020390.blogspot.com"target="_blank"><img src="http://i209.photobucket.com/albums/bb287/yono_pati/intan-1.gif" width="125" height="125"/></a>
</div>
Keterangan
- Yang berwarna biru, silakan diganti dengan URL blog atau situs kita masing-masing.
- Yang berwarna merah, silakan diganti dengan URL banner kita (yang sudah kita upload pada image hosting) masing-masing.
- Jika ingin menambahkan kotak lagi, kita tinggal memasukkan kode dengan format seperti di atas.
- Jika ingin mengkustomasi ukuran gambar/image, ubahlah angka pada width dan height.
Ketujuh, simpan perubahan.
Kedelapan, refresh blog dan jika berhasil, tampilannya seperti di bawah ini.
Kesembilan, selesai
Tidak ada komentar:
Posting Komentar