Pages

Saturday, March 24, 2018

Tutorial : Shadow Link Hover

Assalamualaikum!
Hai korang.

Korang nampak apa-apa perubahan tak kat blog aku sekarang?
Tak nampak? Yelah yelah.

Sebelum ni kan kalau korang move cursor dekat link dalam blog ni, mesti akan ada double dashed hover kan? Tulah, aku dah bosan sebenarnya sebab dah hampir 8 tahun kut aku guna style yg sama. So kali ni aku nak bertukar angin lah orang kata.

Nampak bershadow pulak kan link hover aku?

Tapi tulah, aku cari jugak tutorial untuk jadi macam ni. Malangnya tak jumpa!
Pelik jugak.

So, aku terfikir satu cara yg biasa dan mudah. Then aku decide nak try je lah. Tak jadi takpe.
Poofff...!!

MENJADI LAH KORANG !!

And now of course aku nak share lah apa lagi.

1. Dashboard - Theme - Edit HTML - ctrl + F

2. Search code ni :

a:hover {

3. Copy code ni :

text-shadow: 2px 2px 3px #000000;

4. Paste di bawah code pada Step 2. Tapi kalau korang dah ada hover lain sebelum ni, contoh macam double dashed macam aku dulu, korang buang dulu code tu tau. Takut bertindih. So, akan jadi macam ni :

a:hover {
text-shadow: 2px 2px 3px #000000;
color: $(link.hover.color);
}

5. Ubah yg aku merahkan tu dengan colour code pilihan korang. Meh terjah sini untuk colour code korang.

6. PREVIEW dulu dan tengok kalau takde error, then baru SAVE tau.

Alhamdulillah.
Sonang bona kan? Hehehe.

No comments: