Cara pasang menu scroll pada blog

Memasang scroll bar pada blog tujuannya yang utama adalah bagi menjimat kan ruangan.Cara membuat nya amat mudah dengan hanya  mengikut langkah dibawah ini.

1.Masuk ke dashboard,
kemudian pilih Layout-->>add gadget




2.HTML/JAVASCRIPT



Masukkan kod berikut:

<div style="background-color: white; border: 1px solid rgb(204, 204, 204); height: 80px; overflow: auto; padding: 5px; width: 170px;">
masukkan teks atau apa apa kod yang hendak dipaparkan disini atau
</div>

Saiz kotak scroll boleh ditukar pada width(lebar)dan height)tinggi pada kod diatas

Memasang scroll bar pada blog tujuannya yang utama adalah bagi menjimat kan ruangan.Cara membuat nya amat mudah dengan hanya  mengikut langkah dibawah ini.

Untuk membuat menu scroll :









kod nya adalah seperti dibawah ini :

<div class="widget-content">
<ul style="width: 145px; height: 150px; background-color: #FFEAEA;  font-family: verdana; font-size: 10px; font-weight: bold; text-align: left; border: 2px ridge #52FF20; overflow: auto;">


<li><a href="http://teknikbuatblog.blogspot.com/2010/03/cara-membuat-blog.html" target="_blank">Cara membuat blog</a></li>
masukkan link seterusnya....

</li></ul></div>
 
Jika hendak letakkan nombor dihadapan senarai gantikan ul  kepada ol
ul akan memaparkan bullet dihadapan

Kod warna oren untuk kod scroll
Kod warna hijau adalah link artikel dan warna biru tajuk artikel yang hendak paparkan
Scroll akan muncul bila kandungan pada list melebihi ketinggian yang diletakkan pada kod(overflow:auto).Jadi ubahkan ketinggian pada height.

3.kemudian save untuk melihat hasilnya.

update 20/6/2013

Post a Comment

68 Comments:

mohammka7476 said...
Teknik Buat Blog

try x blh pun?

mikelle said...
Teknik Buat Blog

Thanks for visiting dear friends, have a good day :)

Anonymous said...
Teknik Buat Blog

Salam....
Saya baru belajar blogspot...nak tanya bagaimana nak buat menu box di tepi cnthnya:
Pentadbiran
Aktiviti
Visi
Dan lain lainlah

Anonymous said...
Teknik Buat Blog

kalau laman web abang ni...yang ditepi tu...
Blog
Photoshop
Tips Komputer

yahaya said...
Teknik Buat Blog

@Anonymous
caranya sama sahaja tapi perlu masukkan kod untuk senaraikan link.saya akan masukkan pada posting akan datang.

sibersensasi said...
Teknik Buat Blog

saya telah update dengan memasukkan juga cara membuat menu scroll

Admin said...
Teknik Buat Blog

@mohammka7476btulah try tak jadi

sibersensasi said...
Teknik Buat Blog

@kiff

kepada rakan kita mohammka dan kiff saya telah buat perubahan pada kod diatas(kedudukan kod salah).jika tiada scroll disebelah tepi ubahkan saiz pada height,kerana jika teks sedikit scroll tidak muncul.Terima kasih atas teguran dan saya mohon maaaf atas segala kesulitan.

positiveAlpha said...
Teknik Buat Blog

Saya dah cuba & berjaya :) Sangat mudah diaplikasikan pada blog widget juga! Terima kasih!

addy saufi said...
Teknik Buat Blog

saya akan cuba di masa2 akan dtg...banner tlh sya ambil senang nk follow..tq

mdzuardi said...
Teknik Buat Blog

Dah cuba dan berjaya,cuma klu kita klik pada link, dia keluar windows baru, macam mana nak bagi keluar pada windows yang sama?

sibersensasi said...
Teknik Buat Blog

@mdzuardicuba tukar target pada link target="_blank" kepada target="_self"

miho amyra said...
Teknik Buat Blog

tQ !
sGt mEmbAntU sAYe !

ghost said...
Teknik Buat Blog

camner plak nak buat scroll kat Mister linky's.ada kah sama cara pemasanganya.?

sibersensasi said...
Teknik Buat Blog

@si biskutboleh juga guna cara ini...

ghost said...
Teknik Buat Blog

tapi masalahnya nak letak kod yang dibagi tue kat mana?anywhere?

sibersensasi said...
Teknik Buat Blog

@si biskutsalin kod diatas sekali gantikan dengan kod pada teks warna kuning.Boleh juga nak buat staik pages dan letakkan kod selain dari letak pada sidebar

ghost said...
Teknik Buat Blog

aduh masih gagal nie toh..

pN.rOs said...
Teknik Buat Blog

yeay da berjaya ... tq sesangat.. tayang kamoo

cik jannah said...
Teknik Buat Blog

saya tak berapa pahamla..kalau nak sentiasa u[date lak camne??

Myra Jay said...
Teknik Buat Blog

tima kasih. sy dh cuba berjaya la:)

luahan said...
Teknik Buat Blog

salam... kak sofi cuba ambil tip dr cni nak wat kat blog http://anneali.blogspot.com. kl ada masalah boleh minta tolong tak?

sibersensasi said...
Teknik Buat Blog

@sofikalau ada masaalah boleh dikemukakan,saya sedia membantu

ezzati hamid said...
Teknik Buat Blog

tengss. dah lama cari ni. heheh. tengkiuuu.

Nurul Lalala said...
Teknik Buat Blog

macammana nak centerkan kotak magic link 2?sy wat dia jadi kat tepi...

Si Cengkeh said...
Teknik Buat Blog

alhamdulillah jadi 10Q tuan yahya

Cikgu Zahora said...
Teknik Buat Blog

best.. tQ..
salam ziarah ya..

nadya e-man said...
Teknik Buat Blog

lau nk wat scroll box utk gmbr lak cne ek?

sibersensasi said...
Teknik Buat Blog

@nadya e-manletakkan link gambar pada teks berwarna kuning

Adhy Tri Prabowo said...
Teknik Buat Blog

thx bozzz...jalan nie...
ow ya,,blog agan udah ane follow,,tolong follow blogku juga yaw...

ATIQ said...
Teknik Buat Blog

berjaya. yeay!! syukran3. ^^

geekz36 said...
Teknik Buat Blog

boleh x nak letak widget "Mister Linky's Magical Widgets" kat page statik ni?

Cik Azz said...
Teknik Buat Blog

Thanx for sharing.. Dah buat dh dan sangat membantu.. =D

no name said...
Teknik Buat Blog

nape saya buat takjdi pun?T_T gambar tak kluar..tapi link kuar ):

sibersensasi said...
Teknik Buat Blog

@Hazrina Erinarrow sebelah link mcm saya buat kena tambah kod

nur amalia said...
Teknik Buat Blog

nape tak jadi pon ea?

sibersensasi said...
Teknik Buat Blog

@dayana batrisyatak nampak scroll sebab nya seperti pada entri diatas..saya dah edit....

toyolkiut said...
Teknik Buat Blog

TK cuba buat satni..
ok, ia jd..
trima kasih..

norliza said...
Teknik Buat Blog

xboleh ler...
saya nak buat scroll kat saya "Mister Linky's Magical Widgets" mcm mana ye?saya xreti buat

redzuan ridz said...
Teknik Buat Blog

terbaikla.. da try da dan berhasil,
tq bro dgn perkongsian ni. great entri :)

Anonymous said...
Teknik Buat Blog

... amat berkesan...

нαηιмQαtяυηηα∂α said...
Teknik Buat Blog

Camne nak pendekkan bloglist yang bawah dia ada "show all" tu? Please buat tutorial pasal ni. Saya tak nak pakai scroll box..

sibersensasi said...
Teknik Buat Blog

@нαηιмQαtяυηηα∂αpada widget tu ada pilihan untuk (show)paparkan semua atau bilangan yg lain.

anakdenesor said...
Teknik Buat Blog

klo nk buat scroll bar utk archive mcm mane yea?

Unknown said...
Teknik Buat Blog

walaupon susah nak wat but at last jd gak ...fuhh!! <3

khairul said...
Teknik Buat Blog

bagaimana caranya utk sy masukkan "labels" dan "bloglist" kedalam scroll box ?

khairul said...
Teknik Buat Blog

mcm mana nk masukkan labels dan bloglist kedlm scroll box ?

sibersensasi said...
Teknik Buat Blog

@khairulada tutorial..cara pasang scroll pada widget

Anonymous said...
Teknik Buat Blog

salam en. yg first bole but yg nk msukkn link ke-2 n seterusnye xphamlh..bole tlg detailkn x?tq k..salam..

zehan said...
Teknik Buat Blog

nk tanya, nk buat backup tu camne? sy baru lagi...huhu

sibersensasi said...
Teknik Buat Blog

@khairulcuba kat tutorial cara membuat backup dan menukar template

w4hyu said...
Teknik Buat Blog

Terima Kasih ya kak sangat membantu :)

humaira said...
Teknik Buat Blog

saya baru nak belajar buat blog dan menu scroll.nak tanya link artikel tu nama blog yang kita buat tu ke???

humaira said...
Teknik Buat Blog

saya baru lagi....nak tanya link artikel tu type kan nama blog kita ke?? harap dapat membantu...

sibersensasi said...
Teknik Buat Blog

@Kasih humairA link artikel bermaksud bila kita buka sesuatu tajuk entri ia akan memapar alamat(link)artikel pada ruangan url pada browser.jadi link inilah yg akan kita guna bagi diletakkan pada scroll.link juga boleh didapati dgn klik kanan pada tajuk artikel dan pilih copy link adress ...

humaira said...
Teknik Buat Blog

ok tima kasih ...dah faham dan nak cuba buat...
ilmu yang berguna...

NSAG said...
Teknik Buat Blog

x fhm lah,admin...adeq punya blog blog tutorial,so nk share tuto nih..tpy camner nk ltk scrollbox tuh..camner nk buat dy pgy kt ssuatu widget..
plz reply cpt taw...

Anonymous said...
Teknik Buat Blog

thanks atas informasinya yang sangat bermanfaat dan mudah dicerna

Unknown said...
Teknik Buat Blog

terima kasih untuk kod-kod

Bambang

mrsnurfira said...
Teknik Buat Blog

terima kasih.....

KamilSalleh said...
Teknik Buat Blog

Terima kasih bro.......

Unknown said...
Teknik Buat Blog

nak cari cara buat cursor tu camne ye?? dah try buat background song,ikut step lam ni. :) thanks :) hehehehe.. the best :) keep it up:)

Unknown said...
Teknik Buat Blog

trima ksih cngd... blog nie amt mmbntu syer...t hank you very munch//

Unknown said...
Teknik Buat Blog

macam mana kalau kita tersalah buat then kita nak buang balik ?

sibersensasi said...
Teknik Buat Blog

@Isha Hazanak buang buka semula widget dan klik delete

Unknown said...
Teknik Buat Blog

byk ilmu sy dpt dari blog ini.!!

Sue said...
Teknik Buat Blog

SALAM..nk tnya..mcm mna nk letak link di sebelah blog..contoh sya buat blog sekolah,di tepi blog sya nk buat link dengan ppd or kementrian pelajaran malaysia.tq

sibersensasi said...
Teknik Buat Blog

@Sue

pada dashboard ambil layout...add a widget..html/javascript...letakkan link disana dan klik save