Tutorial : Post and Sidebar Title Hover
Saturday, October 1
Hello people :3 Hari neh nak buat tutorial post and sidebar title hover . First time woo buat tuto . Request from Haguluvkpop . Kalau awak dah tengok , comment tau . Post and sidebar title hover neh macam kat blog neh lah . Bila kita hover kat situ , nanti ada keluar icon comel tu . Okay tak reti nak cakap macam mana . Let's start .
Dashboard > Design > Edit HTML
Cari code .post-title {
Buang anak anak code tu and gantikan dengan code kat bawah neh .
.post-title {
text-align:center;
margin: .75em 0;
font-family:Cambria;
font-size: 18px;
padding: 7px;
}
.post-title:hover {
-webkit-transition-duration: 2.5s;
background-image:url(URL GAMBAR);
background-position:right;
background-repeat:no-repeat;
-moz-border-radius: 25px 10px / 10px 25px;
border-radius: 25px 10px / 10px 25px;
}
Kalau nak buat untuk sidebar title , cari code .sidebar h2 {
Copy code yang sama macam post title tadi tu . Just tukarkan code .post-title { kepada code .sidebar h2 {
Yang code .post-title:hover { neh tukarkan kepada .sidebar h2:hover {
Kalau nak letak background , copy code bawah neh .
background:url(URL BACKGROUND);
Paste kan kat bawah code text-align:center tu yee .
Teka - teki :
Merah : untuk tetapkan title tu berada kat mana .
Biru : font korang and size font tu .
Oren : url icon comel korang . Bole cari kat [ sini ] .
Hijau : bentuk border korang . Pilih kat [ sini ] .
Purple : url background yang korang nak .
Okay dah siap . Preview dulu . Kalau jadi , baru save . Tak faham , tanya tau ! Good luck :] Bye bye .
2 comments
Hagumi ぐみ Hanamoto 花本 said...orait..thanx dear..nk try..huhu ^^
Hana Mohamad said...Welcome :] Jadi tak ?
Cupcake ipsum dolor sit amet icing cotton candy biscuit. Marzipan bonbon pudding bonbon jelly beans bonbon. Gummies pie gummies sweet bonbon chupa chups.