Tutorial : List With Special Hover (Blogskin)


Assalamualaikum and annyeonghaseyo. Okay, tadi tieqa dah buat tutor untuk template designer. Sekarang ni untuk template classic pulak.


1. Dashboard > Template
2. Press Ctrl + f serentak dan cari code </style>
3. Copy code dekat bawah ni
a.baeky{
background:url(URLICON);
background-repeat:no-repeat;
background-size:15px;
padding-left:20px;
color:#000;
margin-bottom:2px;
font:11px verdana;
-webkit-transition: all 0.5s ease;
-moz-transition: all 0.5s ease;
color:#000;
display:block;
}
a.baeky:hover{
background:url(URLICON);
background-repeat:no-repeat;
background-size:14px;
}
4. Paste di atas code </style>
5. Sekarang, copy code ni
<a class="baeky" href="LINK" >AYAT</a><br>
<a class="baeky" href="LINK" >AYAT</a><br>
<a class="baeky" href="LINK" >AYAT</a><br>
<a class="baeky" href="LINK" >AYAT</a><br>
6. Paste dekat mana-mana korang suka
7. Preview & save.

Pink : URL icon sebelum hover
Biru : URL icon selepas hover
Oren : ayat korang
Hijau : link
Posted by at 10:15 AM

7 comment [s]:

Wan Nur Balqish said...

Balqish pinjam and credit dekat akak tuto nih. :)

December 16, 2012 at 2:18 PM [REPLY]
Dania Bella said...

Thanks for tuto.

December 17, 2012 at 12:15 PM [REPLY]
Story Of My Life said...

Jom join : http://aimi-wardina.blogspot.com/2012/12/1st-giveaway-by-aimi-akhairina.html

December 18, 2012 at 8:54 PM [REPLY]
malayasladies said...

Hi beautiful, nice blog. It's simple. Thnx for the tutor. Let's shop with us. http://malayasladieswardrobe.blogspot.com/

December 21, 2012 at 6:20 PM [REPLY]
Afina Ppyong said...

Awak telah ditanda :)

http://emoafina99.blogspot.com/2012/12/mini-end-year-giveaway.html

December 21, 2012 at 9:54 PM [REPLY]
ღ Miza Amirah ღ said...
This comment has been removed by the author.
December 27, 2012 at 10:09 PM [REPLY]
Nur Zakiah Akma said...

saya amik tuto ni dan credit pada akak :)

June 9, 2013 at 10:24 AM [REPLY]

Post a Comment