Home » » Tutorial Scrollbar Blog

Tutorial Scrollbar Blog


بسم الله الرحمن الرحيم

Tutorial, Tutorial Blog, Tutorial Scrollbar, Scrollbar, Cara nak Cantikkan Scrollbar Blog

Assalamualaikum

Hari tu ada orang tanya saya macam mana nak ubah scroll kat tepi blog tu..yang macam gambar kat atas ni. Ok, sekarang saya tunjukkan eh..

1. Design-> Edit HTML-> Klik expand widget template

2. Cari kod ni tekan ctrl+f   ]]></b:skin>

3. Copy pulak kod ni dan letakkan di atas kod tadi

::-webkit-scrollbar {
height:14px;
width: 14px;
background: KOD WARNA;
}
::-webkit-scrollbar-thumb {
background-color: KOD WARNA;
-moz-border-radius: 10px;
border-radius: 10px;
}

KOD WARNA yang pertama tu adalah background scroll
KOD WARNA yang kedua ialah warna scroll tu.
Kalau nak kod warna..cari kat sini >TEKAN<
Height dan weight tu pun boleh diubah-ubah ikut kesesuaian

4. Kalau nak ubah background daripada warna kepada gambar, tukarkan kod background jadi macam ni

background: url(URL GAMBAR);

URL GAMBAR ni pula kawan-kawan boleh cari gambar dan upload di photobucket. Ambil direct link. Tak pun, ambil je la url gambar ape-ape pun yang kawan-kawan suka. 

5. Klik preview dulu..kalau jadi, tekan save.

Selamat Mencuba 


 والسلام



Syukran kerana sudi membaca..boleh Like dan Share entri ini

23 luahan hati:

Muhd Fadlin said...

thanks ye! memang menjadi lah.. :)

Muhd Fadlin said...

yay.. jadi.. thanks.. :)

Ermizi Muhamad said...

salam . saya dah try buat, kenapa tak jadi? ;(

Atika Aula said...

@Muhd Fadlin Firdaus Chan
u r welcome (^__^)

Atika Aula said...

@Muhd Aizie
myb template awak berbeza agaknye..2 yg tak boleh~

AmyZana said...

hohohoho. thank you! :)

mimi_atia said...

tQ2..heheh..cantikk!! superbb..

SyieraDahhari said...

assalamualaikum owner :)
saye gune tuto ini.
tenkiu taw. cantek~

farna♥ said...

thank you !! :D

Surayalalala said...

Terima kasih kak atika :) , kak mcm mne nak buat yang dekat tepi tu yg shout , follow , dashboard & facebook tu gambar boboiboy ngn yaya tu ?

Anonymous said...

thank u so much. dah lame dah cari someting like this :DD

Anonymous said...

thanks. tp macam mana nak buat dashed atau border? saya xnak masukkan gambar. (:

Aisyah said...

kat atas ]]> .. tu maksud nye ape ?? nk letak kt mne ?? x fhm la.. :(

ieda =.= said...

syieda sudah berjaya buat. thanks tuto n tuan tuto ^_^

Unknown said...

Bru wat.. Hehe..
Jd.. tQ.. :)

DEE 1A said...

mintak kebenaran nak copy leh tak =) thank,,,,,,

nasha sanza said...

thanks!!!

عين شاميمي said...

mekaceh! :)

Unknown said...

mcm manerw nk letak border ?? <3

azzwaniamir said...

kenapa saya buat x jadi??boleh bantu tak??

deena nina said...

temkiu ea ,. da jadikk ,.

Anis Stella said...

Terima kasih wat turorial ni :)

wany chemey :D said...

maceh da jd :)

Related Posts Plugin for WordPress, Blogger...

ShareThis

Copyright Control : Atika Aula