Tutorial : Tukar Warna Highlight (Shadow Version)

Assalamualaikum!
Hai korang.

Kalau korang baca post aku yg sebelum ni mesti korang senang je follow tutorial aku kali ni. Seperti yg korang baca daripada tajuk tu, aku nak share cara tukar warna highlight style aku.

Kalau korang tak tahu macam mana rupa style aku tu, cer korang highlightkan mana-mana teks dalam post ni sekarang.
Hah. Faham dah?

Yeay. Jom buat jugak !!

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

2. Search code ni :

a:link {

3. Seterusnya, korang copy codes ni :

::-moz-selection {
text-shadow: 2px 2px 3px #000000; 
}
::selection {
text-shadow: 2px 2px 3px #000000; 
}

4. Paste di atas code dalam Step 2.

5. Ubah yg aku merahkan tu ikut shadow colour yg korang nak. Pastikan satu warna je tau. Jangan atas lain bawah lain pulak. Nak colour code klik sini !!

6. PREVIEW dulu, kalau no error then klik SAVE ganas-ganas !!

Alhamdulillah.

Any inquiry, feel free to ask eh :)

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.

Tutorial : Cara Tukar Older/Newer Post To Cute Icon

Assalamualaikum!
Hai korang.

Dah baca tajuk kan?
Faham kan? Okay proceed.

Hahaha.

Takdelah, gurau je. Macam ni, bila korang scroll sampai bawah blog korang, mesti korang rasa tak best tengok perkataan Older Post + Home + Newer Post tu kan?
Macam hambar je.

Dan sebab tulah hari ni aku nak share cara tukar semua tu dengan icon yg comel kiut-miut macam aku korang. Nak, follow tak nak, babai !!

Sebelum tu, this tutorial belongs to Nemi. Korang pergi la blog dia, lawa woo !! (iklan tak berbayar)
Aku refer dia punya sebab aku lupa nak copy kat word dulu sebelum tukar.


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

2. Search code ni :

<data:newerPageTitle/>

3. Gantikan code tadi dengan code ni :

<img src="IMAGE URL"/>

*MERAH : image url/address/link korang

4. Search code ni :

<data:olderPageTitle/>

5. Gantikan code tadi dengan code ni :

<img src="IMAGE URL"/>

*MERAH : image url/address/link korang

6. Search code ni :

expr:href='data:blog.homepageUrl'><data:homeMsg/>

7. Gantikan code yg aku birukan tadi dengan code ni :

<img src="IMAGE URL"/>

*MERAH : image url/address/link korang

8. Untuk icon tu, korang boleh design sendiri ataupun nak senang dapatkan di sini !!

9. PREVIEW dulu. Takde error then SAVE !!

Alhamdulillah.

Menjadi ke korang? 

Bolehlah komen sikit. Nak tengok jugak korang punya icon macam mana.

Tutorial : Cara Meletakkan Cute Icon Dalam Blog Archive

Assalamualaikum!
Hai korang.

Apa? Korang malas nak membaca?
Yeay, aku pun malas nak menulis panjang.

So, direct terus ke topik kita hari ni.

Hah! Comelkan Blog Archive aku. Apa? Tak comel? Alaa, korang jelous je tu aku faham.
Nak jugak macam tu jom baca lagi!

***First and foremost, of course korang kena ada Blog Archive dulu tau.
***Second important point is korang kena set style Blog Archive korang Hierarchy.


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

2. Search code ni :

<b:includable id='posts' var='posts'>

3. Then, korang nampak tak sebelah kiri code tu ada nombor dan arrow? So, aku nak korang klik pada arrow no 2294.

4. Lepas korang klik, akan muncul beberapa codes kat bawah code di Step 2 yg sebelum ni takde kan? Contohnya :

<b:includable id='posts' var='posts'>
  <ul class='posts'>
    <b:loop values='data:posts' var='post'>
      <li><a expr:href='data:post.url'><data:post.title/></a></li>

5. Seterusnya, copy code ni :

<img src='IMAGE URL'/>

6. Paste ke dalam codes yg aku merahkan dalam Step 4. So, nanti akan jadi macam ni :

<b:includable id='posts' var='posts'>
  <ul class='posts'>
    <b:loop values='data:posts' var='post'>
      <li><a expr:href='data:post.url'><img src='IMAGE URL'/>
<data:post.title/></a></li>

7. Ubah perkataan yg aku birukan dengan image url korang. Nak senang cari kat sini !!

8. PREVIEW dulu, kalau menjadi dan takde error, so korang SAVE laju2 !! (excited punya pasal)

Alhamdulillah.

Aku faham tutorial kali ni agak complicated, bukan dari segi cara, tapi keberkesanannya disebabkan berlainan HTML code dan template korang.
So, ada apa-apa soalan silakan komen di bawah.