.




Salam Korang..

Kali nie Wan nak wat tutorial untuk side bar blog korang lak..Tutorial tajuk pada side Bar berlatar belakang/Background/Bergambar/icon/ dan kawaii..Tajuk pun Wan tak taw nak letak apa..Hentam je lah..ehehhe..Apa yang Wan maksudkan ialah macam kat gambar atas or bawah nie..ehehe.



Yang kat atas nie sebelum di ubah suai.Dan kat bawah nie dah di ubah suai..



So ada tak sesape yang berminat??Tutorial nie hanya untuk design/layout template je k..Classic template tak leh k.Template yang Wan gunakan pada WanhazelJunior ialah Minima Template...Wan tak pasti law template yang korang gunakan boleh atau tak..Backup template korang dulu k.

Jum Tutorial..

Mula mula korang wat dulu background untuk bahagian side korang tu..Guna adobe or apa apa medium editing..Law susah sangat nak edit..Korang ambek je gambar kat bawah nie..ekot size dia k..Wat macam kat bawah nie..kosong je..tak yah tulis apa apa..Untuk wat box macam kat bawah nie..Korang leh tengok tutorial nie "Tutorial Art Word (Kawaii cute Fonts)"..Korang tengok tutorial untuk design 2 k..tengok camne nak wat kotak tu je .Save dalam format .PNG.



Law dah selesai tu..Korang ambek kod HTML untuk Box yang korang wat tu...Tengok link nie untuk dapatkan link gambar.."Tutorial nak dapatkan kod gambar/photo"

Dah selsai dapatkan link gambar tu..Korang Edit HTML blog korang lak


Dashboard>Design/layout>Edit HTML
Tick expand widget


Lepas tu korang cari kod ..CTRL+F untuk memudahkan pencarian.


/* Header


Law korang dah jumpa..Korang copy kod bawah nie dan paste diatas kod yang korang cari tadi.

_________


/* Sidebar Content
----------------------------------------------- */
.sidebar {
color: #000000;
line-height:10px;
padding:8px;
margin-bottom:10px;
}
.sidebar h2 {
background:transparent;
background-image:url(LETAKKAN KOD BOX KORANG
);background-repeat:no-repeat; background-position:center center;
color:#ffffff;
padding:18px 0px 0px 46px;
font-weight:bold;
font-size:20px;
line-height:59px;
text-transform:none;
letter-spacing:1px;
text-align:left;
border:0px solid #070200;
}
.sidebar ul {
list-style:none;
margin:0 0 0;
padding:0 0 0;
}
.sidebar li {
background:url("") no-repeat 2px .08em;
margin:0;
padding:0 0 5px 10px;
margin-bottom:2px;
text-indent:3px;
line-height:10px;
}
.sidebar .widget, .main .widget {
border-bottom:0px dotted #faac04;
margin:0 0 0.5em;
padding:0 0 0.5em;
}
.main .Blog {
border-bottom-width: 0;
}
//Http://wanhazel.blogspot.com/



______________


LETAKKAN KOD BOX KORANG
Korang gantikan masuk kod HTML Box korang kat sini

18px 0px 0px 46px;
Korang ubah kod yang berwarna hijau tu je k..Ubah nombor nya..Try and error untuk kedudukan tulisan korang dalam Box tu..Lain lain korang leh godek sendiri.


Selepas tu klik preview..Law tak de error or sesuatu yang buruk terjadi..Korang save je...


So selamat mencuba.


.