13 February 2009

Membuat Menu Tab hyperlink Horizontal atau Vertikal Blogspot

Buat para blogger yang bingung cara membuat menu tab entah horizontal atau vertical. Ini ada software khusus membuat menu tab dengan kode CSS sebagai pondasi awal. Software ini juga aku pakai utuk membuat menu tab seperti di atas. Yach, kalau mau bikin jangan sama denganku bro…

Ok! Ini preview dari software CSS Menu Tab:


Di lihat dengan mata telanjang saja sudah kelihatan simple. Aku sendiri yang dulu sama sekali belum bisa menggunakan dan mengerti kode CSS saja bisa menggunakannya. Memang perlu pengertian juga sich. Tapi gampang kok.

Untuk tampilan saat kita membuat menu tab seperti ini:


















Di samping kanan sudah ada preview dari menu tab yang sedang kita buat. Dan di bawah preview tersebut tersedia pula pilihan dengan dilihat contoh sudah jadi atau dalam keadaan kode CSS dan HTML.


Untuk kode CSS menu tab akan sangat kelihatan karena sudah diberi penjelasan khusus:

Tinggal copy saja kode tersebut dan taruh sebelum kode /head.
Oh ya jangan sampai lupa untuk mengubah alamat url image. Di sana akan kelihatan jelas. Tinggal kita cari gambarnya dan upload ke imagehosting yang banyak bertebaran di internet. Kode dari gambar itu sendiri seperti ini:


Di situ sudah ada keterangan url dari gambar menu tab. Cari saja gambar itu di C:/program File/CSS Tab Designer 2/styles/tab menu atau kalau pengen lebih simple kamu preview saja dan save hasil previewmu tadi secara lengkap.he.. kalau sudah ketemu gambarnya, kamu upload saja ke image hosting. Setelah gambar kamu upload, jangan lupa untuk mengganti “tableftI.gif” dengan alamat url dari gambar yang kamu upload tadi.

Peletakan kode untuk table sendiri nggak terlalu sulit. Untuk blogger, kamu copy saja kode seperti contoh gambar di bawah ini ke elemen tambahan HTML/Javascript dan taruh saja di bawah header. Ini khusus untuk menu tab horizontal, sedang untuk tab vertical kamu tambah dari sidebar kanan atau kiri.



Jangan lupa untuk mengganti url sesuai yang diinginkan. Buat para blogger, biasanya dibagi atas dasar label. Biasanya pembagian terlihat dari url hyperlink menu tab. Contoh http://mylovera.blogspot.com/search/label/aboutus. Dari keterangan itu, kita membuat hyperlink dengan alamat tersebut untuk mencari semua artikel yang diberi label aboutus. Lihat saja dari blogku kalau masih bingung.


Jika sudah jadi, preview saja dengan firefox atau apa terserah. Semisal ingin lihat dalam firefox hasilnya akan seperti ini:
Buat yang ingin mendownload, buka saja artikelku sebelumnya di download CSS Menu Tab
Selamat Mencoba.senyum

Add to Technorati Favorites

Bookmark and Share


Baca Artikel lainya:

3 comments:

Blog anak IT said...

Maz belly, aq izin copas artikelmu yapz?

Tri said...

maz belly, tolong di tutor untuk memasukkan web page menjadi format gambar, sehingga bisa kita sisipkan dalam tulisan dalam blog kita. thanks

jack said...

maknyus kang infonya thanks yak....