Tutorial : Icon Cute Tepi Bloglist


Selamat petang! Hari ni masa agak panjang terluang di rumah so banyak betul kerja nak buat. Pagi tadi lepas bangun terus buang taik mata, tenyeh hilangkan semua air liur basi yang melekap lekap dekat pipi then pergi sekolah. Breakfast pun hanya roti canai dengan air ho ho hoo Horlick tu. Sampai tergagap gagap nak sebut menu pagi tadi. Tak apa lah janji sodap dan ada makanan kan?

Tetiba rasa hari ni macam nak buat tutorial pertama dalam blog ni. Eh ketinggalan zaman lah kau ni Zylee. Orang lain dah lama dah buat tuto semua tu. Hihi kisah pulak aku. Lambat ke cepat suka hati aku lah kan? Amboi jauh tersasar aku melalut dari entri kali ini. Okay mari kita start belajar tutorial ini.

FOR PENGGUNA TEMPLATE DESIGNER

1) Dashboard > Design > Page Element > Pergi tekan setting untuk blog list korang. Untick button ICON dan terus save. Tengok gambar bawah untuk lebih jelas. (P/S : If korang tak ada blog list ni, just tekan add gadget dekat page element. Cari yang ada tulis Blog List. Tekan ADD okay.)



2) Next korang pergi Dashboard > Design > Edit HTML > Tick Expand Widget Templates. I would prefer if you all back up blog korang so if ada pape berlaku, boleh cover balik.

3) Tekan button F3 dan cari kod dekat bawah ni.
]]></b:skin>

4) Okay jumpa tak? Good kalau jumpa. Copy code dekat bawah ni dan paste dekat atas code yang korang cari tadi.

.sidebar ul li {background:url("URL GAMBAR") no-repeat 2px .25em;margin:0;padding:0 0 3px 16px;margin-bottom:2px;text-indent:7px;line-height:1.3em;}

5) Preview dulu tau. If jadi terus save.

FOR PENGGUNA LAYOUT

1) Direction sama macam untuk pengguna TD. Setting bloglist.

2) Dashboard > Design > Edit HTML > Tick Expand Widget Templates > Download Full Templates.
*Apa pun kita kena back up. Takut kang tak jadi merana korang semua. Hihi

3) Tekan button F3 dan cari kod di bawah ini.

.sidebar ul li {

4) Copy dan paste kod bawah ni dekat bawah kod .sidebar ul li { ni.

background:url(“URL GAMBAR”) no-repeat 2px .25em;
margin:0;
padding:0 0 3px 16px;
margin-bottom:2px;
text-indent:7px;
line-height:1.3em;
}

5) Preview dulu. Kalau jadi save terus.

6) Or if korang tak jumpa kod .sidebar ul li {, korang try cari kod dekat bawah ni pulak dekat kotak yang korang tekan F3 tadi.

.sidebar li {

6) Copy dan paste code dekat bawah ini dekat bawah kod yang korang cari tadi.

background:url(“URL GAMBAR“) no-repeat 2px .25em;
color:#000000;
border-bottom:2px solid #FFFFFF;
border-top:2px solid #FFFFFF;
border-right:2px solid #FFFFFF;
border-left:2px solid #FFFFFF;
margin:0;
}

7) Okay tekan Preview. If no error plus icon tu ada terus save okay?

Hm if korang tak tahu mana nak cari icon yang comel comel tu untuk replace dekat URL GAMBAR tu, korang pergi Photobucket ataupun Glitter-Graphic. Kalau ada apa masalah or tak jadi, bagitahu tau.

2 comments:

Umie Nadhirah said...

rajinnya buat tuto.. thanks yaw! ^^

Zylee Rahman said...

hihi tuto senang.
btw try lah :)

Post a Comment

Hai my dear.
Drop your comment here okay?
Thank you!