Tutorial: Sidebar Title Icon Hover

Assalamualaikum.. ^_^

Sidebar Title Icon Hover?? Apa tu? 

Title sidebar sebelum disentuh:

Title sidebar apabila disentuh:

Ok jom kita mulakan tutorial ni ^_^

 1. Dashboard > Template > Edit HTML.

2. Right click > Select All > Right clik > Cut > Paste.  

(UNTUK KELUARKAN SEMUA ANAK ANAK CODE)

3. Tekan CTRL + F > cari kod h2 { ataupun /* Headings

4. Copy code yang ada bawah ni dan pastekan di bawah code h2 { ataupun /* Headings.

h2 {text-align:center;font: 13px arial;color: #616161;border-top: 3px solid #FFACAC;border-bottom: 3px solid #FFACAC;background: url(Icon Sebelum Hover);background-position:bottom right;background-repeat:no-repeat;background-color: #FFDCDC;padding: 3px;}.sidebar h2:hover {text-align:center;font: 13px arial;color: #616161;border-top: 3px solid #95CEFF;border-bottom: 3px solid #95CEFF;background: url(Icon Selepas Hover);background-position:bottom left;background-repeat:no-repeat;background-color: #DCE9FF;margin:1em;padding-left: 50px;-webkit-transition-duration: 2s;font: 13px arial;color: #616161;}

Note:

Biru : Tukar colour dan border sebelum hover

Merah : Tukar icon sebelum hover

Coklat emas : Tukar colour dan border selepas hover (Solid, Dashed, Dotted.)

Pink : Tukar Icon selepas hover

Icon

  

Click here to get more cute icon 

Credit to: Kak Miza