RSS Feed

Tutorial: Cara mudah buat Tabber Widget

23

June 12, 2012 by


Ikaa, khas untuk anda.

Sumber utama tutorial ini datang dari sini. Saya sekadar mengubahnya sedikit. Tidak lupa juga, terima kasih kepada saudari Masz Sidek, yang menjawab pertanyaan saya tentang widget ini.

Fungsi utama Tabber Widget: Menjimatkan ruang, menambahkan kekemasan pada blog. 

Caranya:
1. Klik pada Dashboard - Layout - Add A Gadget. Pilih HTML/Java Script. Ruang Title dibiarkan kosong.

2. Klik link ini. Copy kod HTML yang terdapat pada point nombor 4 dan paste-kan keruang Content kotak HTML/Java Script tadi. Cara untuk Copy ialah dengan menekan ikon yang berbentuk '<>' (seperti dlm gambarajah 1). Klik Save.

Gambarajah 1

3. Balik semula ke Layout. Dibawah widget HTML/Java Script tadi, susun dan aturkan widget-widget yang anda mahu masukkan kedalam Tabber Widget (gambarajah 2). Contoh: saya aturkan widget Shoutbox, Bloglist dan Archive untuk tabber widget diblog saya. Hasilnya seperti dalam gambarajah 3. Preview dulu, apabila berpuashati, barulah Save.

Gambarajah 2

Gambarajah 3

Notes:
- Untuk mengubah bilangan widget, cari kod ini:  tabCount:3, tukar nombor 3 tu kepada jumlah widget yang dikehendaki. Letak 10 pun boleh. Jangan lupa, selepas itu, susun juga 10 widget under HTML tu (rujuk step no. 3).

- Untuk ubah warna background box, cari kod dibawah ini:

.tabber .widget-content {
 border: 1px solid #bbb;
 padding: 10px;
 background: #fff;

Pada line background: #fff tu, ubah kod color #fff tadi mengikut kod warna pilihan.

Siap! Saya galakkan anda membaca sedikit sebanyak komen2 dari pengguna tabber widget ini di link yang diberi. Anda akan dapat lebih informasi. Selamat mencuba.



23 comments »

PariPariPutih said...

He he he ada jugak terselit si paripari kat situh hu hu hu ^^

uncle said...

waa bagus widget ni..uncle tak berani nak cuba hahahha..buat leh tak? hihihi

leakedknowledge said...

kehkehkeh dah tau lama dh sal tute nih...biasa lepak kt situ juga :)


http://encikcopypaste.blogspot.com/

caliph shuriken said...

tutorial yg menarik, nice sharing ^^

APAN said...

mmg kemas tabber widget ni...masa awal2 ubah template dulu, pernah cuba gak buat...tp cam ada masalah ngan template...terus aku hold dulu...skang ni da xde masa nak kacau part modifikasi ni...tengok2 la kalau tukar template lain lak pasni...mungkin akan cuba balik pasang tabber widget...hebat la kakak...

~ Cik Azz ~ said...

Sekarang ni akak dah agak malas nak main dgn widget/gadget ni..

Cuma dok tukar2 header je.. haha...

Sally Yatiey said...

Nice tutorial! Thanks Cik Lana. Dah buat dah. hehe ^_^

Jajas said...

o0o0o0o...

Cik Kay Jue said...

hahahaha baru ingt nak tanya..

ary_lee said...

Lana, nak tanya..
Berat tak pakai widget cenggitu?

nasir hamzah said...

sedih tgk org sume dah kehadapan. nasir masih ketinggalan.huhu.

aizamia3 said...

dulu rajin ubah itu buat ini tapi sekarang guna apa yang ada.. kekangan masa.. nak pulak dah semakin sibuk dengan dak Nuha.. ;)

uncle said...

kat opis ada sekatan..kotak chat box..cbox tak leh guna melainkan fibox je hihihi

Adylia Qarissa said...

pening pening pening..lana tolong buatkan boleh?? ;p

Hazwan Arif said...

Thanx..dah try buat tapi x sesuai dgn blog..x cantik

http://kalampatah.blogspot.com/

uncle said...

uncle dah buat..mmg menjadi....hahah terima kasih..cuma uncle tak leh chat kat dalam blog lana..sebab pakai cbox...kena ban kat opis..kalau fibox tu ok jer

Masz Sidek said...

sama2, lana... sy pun ada buat tuto ni... utk kegunaan masa akan datang... kalau tukar template lagi takla tercari2.. :)

faridah nazurah said...

macam best je.. akak leh tolong pasangkan tak? hehe :P

uncle said...

ada blog yg tertentu yg boleh bukak cbox..yg lain hanya keluar paparan kosong jer ... uncle syorkan fibox sebab ianya ringan hihihi dan mudah untuk uncle masuk.

Deq's Qienz said...

ermm bgusnya totu nihhh..hehee

buatbest said...

makin berisi makin kayo la den..hahah

Husnalyas said...

a'a la. nmpk kemas sgt :)

Syazlina Khairuddin said...

syaz mmg nak buat sgt! cme x de mase lagik nak buat..thanks for the tutorial lana..hehe =)

Powered by Blogger.