Tutorial : Header Hover Bergerak Ke Tepi (Template Designer)

Nak header korang bergerak ke tepi? It's not that important but it's cool. Jom buat! Oh ye, diingatkan tutorial ni hanya untuk pengguna Template Designer yang menggunakan layout Simple oke :)

1. Dashboard > Design > Edit Html

2. Tekan Ctrl+F, cari code kat bawah ni
/* Header
As you can see, full code die macam kat bawah ni kan kan kan?
/* Header
----------------------------------------------- */
3. Copy code kat bawah ni then paste bawah code tadi.
.header:hover{
padding-left: 30px;
-webkit-transition-duration: 5s;
}
And it'll become like this :
/* Header
----------------------------------------------- */
.header:hover{
padding-left: 30px;
-webkit-transition-duration: 5s;
}
Padding-left : Boleh pilih left, right, top or bottom.
30px : I'm not sure about this, but you can change it too. Try and error.
5s : Time untuk header korang move ke tepi tu :)

4. Preview & Save.

-Selamat Mencuba-

Comments

FYA PELANG! said…
terima kasih ! dah lame carik untuk template designer :)
FYA PELANG! said…
err. tapi, still tak menjadi -_-" camne ehh ? adess :( #saye cetek ilmu
Cik Tyrah said…
@FYA PELANG!

sis tgk time preview ke?
Hana Lolo said…
sis, kenapa adik punya tk bole? adik guna template blog skin. tk boleh pun. adik harap sis reply dkt fb adik : HANA NICH
Cik Tyrah said…
@Hana Lolo

tuto ni utk pngguna template designer layout simple je. utk blogskin, adik kena rujuk tuto laen :)
F.A.H.A. said…
okay menjadi.thanks :)
Me , Dyana said…
saya punya x de code utk dicari tu ,,
mcm mana ek ? nak ltak kat mana code tu ?
Cik Tyrah said…
@Me , Dyana

tyrah dah tengok blog sis, sis guna blogskin. Memang takde code die sebab ni untuk template designer.
Noor said…
sy punya header menjadi bila guna tuto ni..hehhe..thx bnyk2..
nyna amani said…
Thanx for this tuto! :)