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

Catat Ulasan

68 Comments:

mohammka7476 berkata...
Teknik Buat Blog

try x blh pun?

mikelle berkata...
Teknik Buat Blog

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

Tanpa Nama berkata...
Teknik Buat Blog

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

Tanpa Nama berkata...
Teknik Buat Blog

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

yahaya berkata...
Teknik Buat Blog

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

yahaya berkata...
Teknik Buat Blog

saya telah update dengan memasukkan juga cara membuat menu scroll

kiff berkata...
Teknik Buat Blog

@mohammka7476btulah try tak jadi

yahaya berkata...
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 berkata...
Teknik Buat Blog

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

Adisaufi berkata...
Teknik Buat Blog

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

mdzuardi berkata...
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?

yahaya berkata...
Teknik Buat Blog

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

LittLeMyRsHMaLLoW berkata...
Teknik Buat Blog

tQ !
sGt mEmbAntU sAYe !

si biskut berkata...
Teknik Buat Blog

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

yahaya berkata...
Teknik Buat Blog

@si biskutboleh juga guna cara ini...

si biskut berkata...
Teknik Buat Blog

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

yahaya berkata...
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

si biskut berkata...
Teknik Buat Blog

aduh masih gagal nie toh..

pN.rOs berkata...
Teknik Buat Blog

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

نورالجنة berkata...
Teknik Buat Blog

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

Myra Jay berkata...
Teknik Buat Blog

tima kasih. sy dh cuba berjaya la:)

sofi berkata...
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?

yahaya berkata...
Teknik Buat Blog

@sofikalau ada masaalah boleh dikemukakan,saya sedia membantu

zty berkata...
Teknik Buat Blog

tengss. dah lama cari ni. heheh. tengkiuuu.

nurul lalala berkata...
Teknik Buat Blog

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

fatta berkata...
Teknik Buat Blog

alhamdulillah jadi 10Q tuan yahya

Anak Gemilang berkata...
Teknik Buat Blog

best.. tQ..
salam ziarah ya..

nadya e-man berkata...
Teknik Buat Blog

lau nk wat scroll box utk gmbr lak cne ek?

yahaya berkata...
Teknik Buat Blog

@nadya e-manletakkan link gambar pada teks berwarna kuning

adhy sayang ibu berkata...
Teknik Buat Blog

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

al-hirr berkata...
Teknik Buat Blog

berjaya. yeay!! syukran3. ^^

geekz36 berkata...
Teknik Buat Blog

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

~ Kak Azz ~ berkata...
Teknik Buat Blog

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

Hazrina Erin berkata...
Teknik Buat Blog

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

yahaya berkata...
Teknik Buat Blog

@Hazrina Erinarrow sebelah link mcm saya buat kena tambah kod

dayana batrisya berkata...
Teknik Buat Blog

nape tak jadi pon ea?

yahaya berkata...
Teknik Buat Blog

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

toyolkiut berkata...
Teknik Buat Blog

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

umiliza989 berkata...
Teknik Buat Blog

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

redzuan berkata...
Teknik Buat Blog

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

niL.. berkata...
Teknik Buat Blog

... amat berkesan...

нαηιмQαtяυηηα∂α berkata...
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..

yahaya berkata...
Teknik Buat Blog

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

AnAk dEneSor berkata...
Teknik Buat Blog

klo nk buat scroll bar utk archive mcm mane yea?

Niena Aziz berkata...
Teknik Buat Blog

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

khairul berkata...
Teknik Buat Blog

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

khairul berkata...
Teknik Buat Blog

mcm mana nk masukkan labels dan bloglist kedlm scroll box ?

yahaya berkata...
Teknik Buat Blog

@khairulada tutorial..cara pasang scroll pada widget

Tanpa Nama berkata...
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 berkata...
Teknik Buat Blog

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

yahaya berkata...
Teknik Buat Blog

@khairulcuba kat tutorial cara membuat backup dan menukar template

w4hyu berkata...
Teknik Buat Blog

Terima Kasih ya kak sangat membantu :)

Kasih humairA berkata...
Teknik Buat Blog

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

Kasih humairA berkata...
Teknik Buat Blog

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

yahaya berkata...
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 ...

Kasih humairA berkata...
Teknik Buat Blog

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

NSAG berkata...
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...

Rudy Hartono berkata...
Teknik Buat Blog

thanks atas informasinya yang sangat bermanfaat dan mudah dicerna

bambang agus s berkata...
Teknik Buat Blog

terima kasih untuk kod-kod

Bambang

mrsnurfira berkata...
Teknik Buat Blog

terima kasih.....

kamil salleh berkata...
Teknik Buat Blog

Terima kasih bro.......

Lily Pad berkata...
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:)

eyqa syafiqa berkata...
Teknik Buat Blog

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

Isha Haza berkata...
Teknik Buat Blog

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

Fokus Impian berkata...
Teknik Buat Blog

@Isha Hazanak buang buka semula widget dan klik delete

mohd din ibrahim berkata...
Teknik Buat Blog

byk ilmu sy dpt dari blog ini.!!

Sue berkata...
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

Fokus Impian berkata...
Teknik Buat Blog

@Sue

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