Monday, August 29, 2011

Tutorial 115 : Mencantikkan Scroll Bar Blog.

Assalamualaikum, alhamdulilah dah sembuh dari demam. Moga sembuh sepenuhnya. Misi hari ini nak buat cake! yeaahaaa..So lepas subuh malas nak tidur..hahaha sebab semalam lepas telan panadol. Terus pengsan tak sedar diri muahaha..

Kerana subuh ni ada mood nak tulis tutorial. So tulislah untuk korang. Ngah freekan..

Nak ajarkan korang untuk cantikkan scroll bar blog korang yang nampak biasa-biasa je tu.
Macam blog aku ni :



Tapi tutorial ini hanya sesuai dengan penggunaan GOOGLE CROME sahaja, kalau guna Mozilla korang takkan nampak effectnya. So kalau nak lihat hasilnya. Sila download dan install GOOGLE CROME anda.

1. Sign in Blogspot > Design > Edit Html

2. Cari code di bawah , Ctrl F dan paste dalam kotak find..enter!



]]></b:skin>


3. Copy code di bawah dan paste sebelum/di atas code yang dicari tadi.



::-webkit-scrollbar {
height:12px;
width: 12px;
background: #FF1493;
}
::-webkit-scrollbar-thumb {
background-color: #BA55D3;
-moz-border-radius: 10px;
border-radius: 10px;
}

4. Sekarang korang boleh tukar :
Warna background scroll bar : #FF1493 
Warna scroll bar : #BA55D3
More colour? Click here


5. Preview, kalau dah puas hati dan menjadi silalah tekan SAVE!


P/s : KOmen-komenlah yer lepas mencuba!





94 comments:

  1. err , kenapa dia jadi laen ? macam rosak je scroll bar saya ?

    ReplyDelete
  2. kenape tak menjadi Kak Farah ??

    ReplyDelete
  3. @♥Cik Nurfarah♥ jadi laaa ! thanks kak!
    http://mizzanies.blogspot.com

    ReplyDelete
  4. a'ah..kenape ta jadik ye k.farah ?

    ReplyDelete
  5. tak jadik pon..dah lama cari tutorial nih..tp tak jd lak

    ReplyDelete
  6. Thanks cik Farah...suke2,hampir semuanya menjadik..

    ReplyDelete
  7. Dah jadi,..Terimakasih kak farah C:

    ReplyDelete
  8. kak farah,tak jadi laa..keluar tulisan je kat atas..hmm..tolong..tolong..terima kasih..

    ReplyDelete
  9. @Ledy Ecah thanx kak farah..
    ingat ken x jadi tdi .. :P

    ReplyDelete
  10. Yey ! Jadi , Alhamdulilah . Thnx ya kaka

    ReplyDelete
  11. Kak farah , npe dy jadi cm panjang eh ?
    Dy jadi cm ni , http://aintheravenclaw.blogspot.com/

    ReplyDelete
  12. hye kak farah nie alisya maybe kak farah tak kenal kakak saye yg perkenalkan blog akak kat saye tapi saye still tak jumpe macam mane kite nak buat favicon tu...
    saye dah cari kat tutorial tapi tak jumpe pon...

    ReplyDelete
  13. @aina
    tq sys ! ade tuto akk byk mnjdi kat blog sye . =)

    ReplyDelete
  14. salam. nak tanya la. tutorial yang ni untuk template minima je ke? kalau yang guna template designer menjadi tak?

    ReplyDelete
  15. @Mashitah Rahim

    Jadikk..tapi syarat kena guna google crome yer

    ReplyDelete
  16. @Li$y@ EMO

    try this

    http://bicarafarah.blogspot.com/2010/12/tutorial-27-membuat-favicon-sendiri.html

    ReplyDelete
  17. @♥Cik Nurfarah♥ Tapi saya buat tak menjadi. dah banyak tengok tutorial ni daripada blog orang lain dan cuba jugak, still tak menjadi. padahal view guna chrome. huhuhu. ni yang sedih nii. :(

    ReplyDelete
  18. kak farah , mekasih .. jadik .. blog un daa ok daa .. :)

    ReplyDelete
  19. kak farah,,,,macam mane nak cari kod nie....
    saye wat xjumpe2 pon...T-T

    ReplyDelete
  20. nmpk mcm senang . tp bile buad tahla :(

    ReplyDelete
  21. Woah ! Thank u very much ! i'm glad to find this tutorial !

    ReplyDelete
  22. thanks kak farah syng kak farah akhirnye jdi gak!kalo gi jt tmpt lain tuto die ssh tpi kt blog akak sng jewp!

    ReplyDelete
  23. Kenapa saya buat tak boleh? saya pilih warna dia ambik semua warna kat situ

    ReplyDelete
  24. T_T !!
    @♥Cik Nurfarah♥ ...
    x jadi laa~~~
    waktu saya view blog kan ada tulisan kat atas tu~~~T_T

    ReplyDelete
  25. kak Farah .. tak jadik pon .. help please .... :'(

    ReplyDelete
  26. knape tak jdii erk ?
    dah gna google chrome nhe .. npe x jadii jgak ?

    ReplyDelete
  27. Kenapa tak jadi ~ Da gune google chrome pon ta jadi ~

    ReplyDelete
  28. to all

    org lain buat menjadi je, sy buat eksperimen pun menjadi. so mesti ada maslah dgn template anda

    ReplyDelete
  29. saya buat tak menjadi la kak farah..gune google chrome pon tak boleh jugak.. :(

    ReplyDelete
  30. Kak Farah , sy buat mnjadi ... :)
    Tapi , masalah skrg nya , knp kdg2 aje scroll bar tu muncul ? Lpas refresh byk kali , bru timbul blik ... Bleh tlg x ?

    ReplyDelete
  31. Thanks akak!!menjadik la...

    http://mylifesiti.blogspot.com/

    ReplyDelete
  32. @♥Cik Nurfarah♥ -thanks..dh jd lh...

    ReplyDelete
  33. sye punye pon tk jadi la akq farah ..
    sebab ade tulisan kt atas. .
    aqk tlong watkan ..leh tk ni link blog sye http://sibudapendek.blogspot.com/

    ReplyDelete
  34. tak jadi la akq farah ..tk fhm la petu tu ..akq wat kan kt blog ni leh tk ..ni linkhttp://sibudapendek.blogspot.com/

    ReplyDelete
  35. kak farah , saya guna tuto kak farah . terima kasih .

    ReplyDelete
  36. Yeay,menjadila! Thank you Kak Farah :3

    ReplyDelete
  37. @HanimRaz tak jadi :( dah guna google chrome tapi tak jadi :(

    ReplyDelete
  38. Tq dik Farah,dah jadi buat....

    ReplyDelete
  39. Assalamualaikum... kak, knp scroll box yg sya buat , scroll box tu ada juga kat bawah... knp eh ? tlg kak..
    ni sya punya blog:
    http://nursyaqinahgadisrandom.blogspot.com

    ReplyDelete
  40. Thank you cik Farah! jadi jadi jadikk~happy hah! haha ^^,

    ReplyDelete
  41. hai kak Farah..thankz buad tuto nih..akhirnya menjadi jugak..seronok sngd ! :)

    ReplyDelete
  42. hihihih..jadi la sis/....thanx sekali g....ni yg best nak kodek2 lagi ni.hihi

    ReplyDelete
  43. akak..cmnew nak guna control F..saya dah buad dah..tpy x keluar dye pnye code..cm ne akk... klo bleh ..akk tlong buadkan bleh x?

    ReplyDelete
  44. saya dah tkan enter tpi x keluar code dyee?? mcm mne ni kak farah??

    ReplyDelete
  45. nak senang macam ni ye KAK..kak farah bleh x bgi tahu sye code ]]></b:skin.
    tu..blehh..sbb saya da buad tpi xkeluar kod dye..jdi akk bgi je code dye ape...

    ReplyDelete
  46. This comment has been removed by the author.

    ReplyDelete
  47. kak farah dh jadik...thanx...terkejut la jugak...btw...thanx...:)

    ReplyDelete
  48. @?Cik Nurfarah? thanks cantik sangat scrool blog thanksss

    ReplyDelete
  49. fara, kita nak tanya la. kenapa blog kita bila scroll ke bawah je mcm ada bahagian yg lebih taw. hmm kalau free nanti cuba singgah blog sy kejap. tengok. haih. tak tau macam mana nak buang yg bawah tu. thanks :)

    ReplyDelete
  50. So nice..... ujian buat scrollbar saya lulus A plus! lol

    ReplyDelete
  51. Thanks akak!! Menjadi lah :3 BTW sya akan terus mengikuti tutorial akak.. ahahaha.. TY ye?

    ReplyDelete
  52. sis kenapa saya carik ]]> x jumpa??

    ReplyDelete
  53. kenapa sy carik "]]>" x jumpa? n kenapa ye if sy click edit html misalnye kena tick expand ... tu sy xde kotak tick tu?? kenapa ye ? so sy x boleh nk modified sy ny blog. stressssss :(

    ReplyDelete
  54. alhamdulillah jadik..terima kasih akak ajar tutorial ni..

    ReplyDelete

-Assalamualaikum, sila tinggalkan komen anda.
-Kalau suka tekan LIKE.
-Insyaallah komen anda akan dilayan :)

Terima kasih lepak sini, nanti datang lagi yer..
Sayang Korang...





Related Posts Plugin for WordPress, Blogger...
 
Copyright © 2016 Blog Cik Nurfarah. All Rights Reserved. Designed by Blog Cik Nurfarah.