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

7 comment [s]:

Wan Nur Balqish said...

Balqish pinjam and credit dekat akak tuto nih. :)

Dania Bella said...

Thanks for tuto.

Story Of My Life said...

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

malayasladies said...

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

Afina Ppyong said...

Awak telah ditanda :)

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

ღ Miza Amirah ღ said...
This comment has been removed by the author.
Nur Zakiah Akma said...

saya amik tuto ni dan credit pada akak :)