Membuat Scroll Pada Blog List (updated)



Tudung kanak-kanak


Salam semua…

Ni lak cara nk buat scroll utk blog list….sya pun suka guna yg ni..lebih kemas…tk perlu nk klik show all…yg buatkan layout kita memanjang ke bawah…

Sebabkan ada yg kurang faham, sya tambah sket lagi tutorial utk lebih jelas…. (updated 7/10 – 4.45pm)

Jom tgk step by step…

Step 1 :

Pegi kt Dashboard > Page Element … akan nampak view yg cam gambar kt bawah kan….pastu klik kt mana2 sidebar yg uols nk buat scroll tu….cth kt sini, sya pilih nk buat kat sidebar My Blog List..yg bertanda bulat tu…




Kemudian klik edit kat sidebar yg anda pilih td, akan keluar view cam gambar kt bawah kan…dn tgk sudut yg plg akhir yg sya highlight tu…

Kat situ la id widget uols…cth yg kt blog sya, id widget utk My Blog List adalah BlogList4…gantikan id widget tersebut dlm kod di bawah….kalau tk nak error typing, copy and paste je (replace kod yg berwarna biru)

#BlogArchive1 .widget-content{
height:200px; /* Tinggi yang diinginkan */
width:auto;
overflow:auto;
}


Step 2 :
Kemudian pegi kt Edit HTML…

Tekan CTRL + F dan copy code di bawah lemudian pastekan kt kotak yg disediakan….kemungkinan di sudut atas kanan atau di sudut bawah kiri…

]]></b:skin>


Kemudian copy keseluruhan kod yg uols buat di step 1, pastekan di atas kod di atas…

Ni antara contoh yg sya buat kt blog…ada 4 sidebar yg sya buat scroll guna code ni kecuali utk blog archive…blog archive blh tgk tutorial kt SINI


#BlogArchive1 .widget-content{
height:200px; /* Tinggi yang diinginkan */
width:auto;
overflow:auto;
}

#BlogList2 .widget-content{
height:200px; /* Tinggi yang diinginkan */
width:auto;
overflow:auto;
}

#BlogList3 .widget-content{
height:200px; /* Tinggi yang diinginkan */
width:auto;
overflow:auto;
}

#Gadget1 .widget-content{
height:200px; /* Tinggi yang diinginkan */
width:auto;
overflow:auto;
}

]]></b:skin>

Gud Luck

Sekian, sampai jumpa lagi…


28 thoughts on “Membuat Scroll Pada Blog List (updated)

  1. lin azlina January 1, 2012 at 2:35 pm

    cara tutorial nk remove balik scroll kat bloglist terjumpa entri kak sya ni …cantik blog kak sya…sy tengah nk edit blog ni

    • syamila January 4, 2012 at 1:50 pm

      blog lin pun cantik juga…berwajah baru

  2. miz ruha February 6, 2011 at 1:34 pm

    thanks sgt,,,,sy da jumpe ape yg sy cri,,,,
    My recent post studying

  3. ibuarifa November 5, 2010 at 8:38 am

    dah berjaya..alhamdulillah..thanks kak syamila..muahhss!!
    My recent post @ Border pada SideBar Blog

    • syamila November 5, 2010 at 2:40 pm

      min..dh berjaya yea..jap lagi nk jenguk la.. 😉

  4. seepot October 29, 2010 at 1:42 am

    kak…tak boleh nk edit pada step 1 tu…
    contoh yang akak punya tu BlogList4 kan…
    saya punya BlogList1…tp tak boleh cut BlogList1 tu.

    • syamila October 29, 2010 at 2:28 am

      kalau tk blh cut….ubah je nombor kt belakang tu….

      • seepot October 29, 2010 at 4:40 am

        tak boleh jugak kak…
        dia dh fix kot…saya tekan backspace tak jd pape pun.

  5. Ellen October 12, 2010 at 2:56 pm

    inilah yang ellen cari..thanks sis

  6. SYaMiLa October 12, 2010 at 2:33 am

    pada yg tk blh jugak tu…email sya yea… syamila02@gmail.com

  7. umizul October 12, 2010 at 2:20 am

    akak xdpat ler…xkuar pun yg akak ckap tu….

  8. fendi_scropio October 12, 2010 at 12:56 am

    xdpt la kak

  9. umialya October 8, 2010 at 12:59 pm

    minat nak cuba, nnt le

  10. SYaMiLa October 8, 2010 at 10:24 am

    has ~ ok2…he3..senang je kan kalau dh faham

    ana ~ sama2…

  11. ana ayesha October 8, 2010 at 2:02 am

    salam syam.

    sy dah buat berjaya. tq tutorial ni bagus

  12. haszuraidah ishak October 7, 2010 at 4:03 pm

    yeay akak..jadi laa..mula2 tak jadi gak kes saya copy coding akak then gi memandai dekatkan dot tu (coz ada jarak sket antara dot ngan bloglist..)

    mitak izin utk copy yer & publish (termasuk blogarchive), sebagai rujukan masa depan..saya link credit utk akak..(bila mau buat ni..huhu)

  13. SYaMiLa October 7, 2010 at 2:59 pm

    hanie ~ blh la cuba

    eira ~ sama2…

    myra ~ akak dh bg kt shoutbox yea

    cicakgirl ~ blh, yg tu hanya nk perlu tambah kod atas kod yg dh ada kt sidebar tu aje…

  14. cicakgirl October 7, 2010 at 12:26 pm

    assalamualaikum kak syamila,
    kalau untuk kod html pun boleh ke? macam scroll box yang akak letak penaja contest/GA tu.

  15. Myra Jay October 7, 2010 at 9:43 am

    Akak TQ ye sbb ssh payah, tp sy pnya bloglist xkluq la ID tu..
    huhu..
    Akak bg emel adress, nti sy emel pic tu

  16. ♥♫♥EiRa♥♫♥ October 7, 2010 at 9:15 am

    thanks akak..=)

  17. Myra Jay October 7, 2010 at 8:41 am

    Salam..Sy nk try buat, tp xreti + xjadila..
    Sy xjumpa pn bloglist4 tu @ sy yg mmg xreti..huhu

  18. Amy Syaquena October 7, 2010 at 8:26 am

    salam..

    thanks pasni boleh cube..

    jemput ke sinar raudah
    http://sinarraudah.blogspot.com/2010/10/i-want-to-change-my-life-can-i.html

  19. Ummi Hanie October 7, 2010 at 7:42 am

    bagus tuto ni ummi…
    lapang2 nnti hanie buat

  20. SYaMiLa October 7, 2010 at 7:13 am

    zaidah ~ senang je kan

    cik tom ~ cuba lagi…

  21. Tomato Gurl's Life October 7, 2010 at 6:58 am

    tak menjadi la akak bila saya preview…tak berani pulak nak save..takpe saya usaha buat lagi..huhu

  22. Zaidah October 7, 2010 at 6:28 am

    terima kasih…zai dah cuba dah..jadik…barulah kemas skit zai nyer blog list

  23. Tomato Gurl's Life October 7, 2010 at 6:23 am

    thanks akak…jap lagi nak cuba..thanks tau 🙂

Leave a Reply

Name *
Email *
Website

CommentLuv badge