Kali ini saya akan berbagi tips ,,yaitu cara mengganti sidebar dengan animasi,yang dipesan oleh seorang teman blogger saya,,,
Untuk menggantinya kita tidak menggunakan
script tetapi dengan gambar biasa dengan
format .gif, jadi tidak akan memberatkan blog. Oleh karena itu kita harus menyediakan gambar terlebih dahulu. Dari pada teman-teman bingung cari
gambar yang tepat, Saya telah menyediakan
gambar yang siap teman-teman gunakan :
Ini adalah link image hosting dari gambar diatas:
gambar 1 :http://i560.photobucket.com/albums/ss44/erge32/RGsdbar.gif
gambar 2 :http://i560.photobucket.com/albums/ss44/erge32/EkaSidebar.gif
Berikut Ini langkah2nya seperti biasa :
1. Masuk ke akun
Blogger Anda.
2. Klik
Tata Letak.
3. Klik
Edit Html
Kemudian cari Kode seperti di bawah ini
pake ctrl + f supaya cepet nyari kemudian isikan
.sidebar h2
.sidebar h2, .middlecol h2, .bottom h2{
color: $sidebarcolor;
text-transform: capitalize;
font-size: 14px;
font-family: Arial, Tahoma, Verdana;
font-weight: bold;
margin: 0px 0px 5px 0px;
padding: 0px 0px 2px 0px;
border-bottom:1px solid $bordercolor;
}
Nah kalo udah ketemu sobat tinggal tambahin aja Background nya seperti dibawah ini
background:#f7f7f7 url(http://i560.photobucket.com/albums/ss44/erge32/RGsdbar.gif?imgmax=800)repeat;
atau
background:#f7f7f7 url(http://i560.photobucket.com/albums/ss44/erge32/EkaSidebar.gif?imgmax=800)repeat;
terserah yang mana dipakai image nya ... jadi kodenya seperti di bawah ini
.sidebar h2, .middlecol h2, .bottom h2{
color: $sidebarcolor;
text-transform: capitalize;
font-size: 14px;
font-family: Arial, Tahoma, Verdana;
font-weight: bold;
margin: 0px 0px 5px 0px;
padding: 0px 0px 2px 0px;
border-bottom:1px solid $bordercolor;
background:#f7f7f7 url(http://i560.photobucket.com/albums/ss44/erge32/EkaSidebar.gif?imgmax=800)repeat;
}
kalau udah selesai simpan template kemudian liat blognya ..
sumber :http://ekakom.blogspot.com/
Home