Cara Buat Scrolling Blog List

Monday, January 17, 2011

Assalamualaikum..

baeklah, hari ni nak share dengan korang macamane nak buat scroll pada blog list..kebetulan, ada blogger yang tanya kat shout box pasal tutorial ni..hehee..

maybi a bit leceh kot..tapi bila ikot step, jadi senang je..mari mulakan, ya..

1. Korang perlu dapatkan id widget bagi blog list yang korang nak pasang scroll :

Pegi Dashboard > Design > Page Elements, then PILIH blog list yang korang nak letak 'scroll' dan kemudian klik Edit.

2. Bila da klik Edit, keluar window untuk widget blog list tu, tengok kat bahagian atas sekali, cari widgetId seperti dalam gambar. da dapat? oke, INGAT/HAFAL id tu yaa..

3. Sekarang, pegi Design > Edit HTML dan tick Expand Widget Templates,tolong Download Full Template dulu ya.

4. Tekan ctrl+f pada keyboard. Copy code bawah ni dan paste pada kotak find tadi.

]]></b:skin>

5. da jumpa? copy pulak code ini dan paste di ATAS code yang korang da jumpe tadi.

#widgetID .widget-content{
height:200px; width:auto;
overflow:auto;

}

widgetID : masukkan id widget yang korang da hafal tadi
height : tinggi kotak blog list
width : lebar kotak blog list

6. kalau korang nak buat 2 or 3 blog list, pisahkan code tadi dengan tanda ini '}' contohnya :

#BlogList1 .widget-content{
height:200px; width:auto;

overflow:auto;

}

#BlogList2 .widget-content{

height:200px; width:auto;

overflow:auto;

}

#BlogList3 .widget-content{

height:200px; width:auto;

overflow:auto;
}
]]></b:skin>

7. Klik Preview, if takde error, then klik Save

yeahh..alhamdulillah siap..eh korang faham ke?huhu..if tak faham, bole tanya yaa..

gud luck uolss..

~wassalam~