Tutorial : Cara Buat Tab Menu

Hola semua,
Hari ni nak share cara nak buat menu tab menu versi My Lovely Bee


Cara-cara nak buat image tab menu
Mula-mula dapatkan image yang nak digunakan
saya menggunakan software Sumo Paint 4.6 coz ia tak perlu di download.
cuma perlu ke website  http://www.sumopaint.com
 
=
Photobucket
 Anda boleh membuat apa sahaja bentuk dan buat mengikut kategori yg dikehendaki
Bila dah siap, upload image ni ke photobucket untuk dapatkan link URL.
ok... siap untuk image

Cara-cara nak letak link tab menu
Mula-mula pergi ke :

dashboard ---> layout --> Add a gadget
then pilih HTML/Javascript

Lepas tu, copy code ni & paste kat ruang content


 <center>
<a href="http://dikbi.blogspot.com" target="_blank">
<img src="http://i1240.photobucket.com/albums/gg487/dikbi/menubuttonhome_zps4188ca5b.png" alt="Photobucket" border="0" /></a>

<a href="http://dikbi.blogspot.com/p/adam-dan-hawa.html" target="_blank">
<img src="http://i1240.photobucket.com/albums/gg487/dikbi/menubuttonadamamphawa_zps17dd574c.png" alt="Photobucket" border="0" /></a>

<a href="http://dikbi.blogspot.com/p/koleksi-bee.html" target="_blank">
<img src="http://i1240.photobucket.com/albums/gg487/dikbi/menubuttonkoleksi_zpse52c8591.png" alt="Photobucket" border="0" /></a>
</center>
Dah siap tekan SAVE

Petunjuk :
Bagi tulisan yang warna merah, anda kena gantikan dengan link anda. Contoh di atas adalah link untuk My Lovely Bee. Setiap image tab menu akan di link ke page yang dikehendaki (rujuk bawah utk cara2 nak dapatkan link page). Manakala tulisan warna biru pula adalah URL image yang telah diupload ke Photobucket.

Cara-cara nak dapatkan link Page
Perasan tak link page tak sama dengan link post/entri?
Contoh link post/entri : http://dikbi.blogspot.com/2012/09/adam-hawa.html
Contoh link page: http://dikbi.blogspot.com/p/adam-dan-hawa.html

Untuk tab menu, kita perlukan link page, bukan link post/entri
 mula-mula pergi ke
 
dashboard ---> Pages --> New Page
Lepas tu akan keluar blank page
So, anda boleh tulis apa sahaja kat sini.
Tapi biasanya page ni digunakan untuk buat table of content
atau senarai post mengikut kategori.
Bila dah siap, tekan publish
Lepas tu, kita akan dapat list page macam ni
Klik link view dan kita dah boleh dapat link page
Contoh link page: http://dikbi.blogspot.com/p/adam-dan-hawa.html
Ok, link ni yg kita gunakan untuk tab menu..




p/s : Ok, dah siap semua. pening tak?
saya pun pening masa nak buat. hihi
takpe, cuba ikut perlahan-lahan ye. kalu tak faham, boleh tanya..
Diingatkan ye, tutorial ni versi My Lovely Bee.




Post a Comment

14 Comments

  1. heee...terima kasih...hihihiikkkk like2

    ReplyDelete
  2. owh mcm ni rupanya nk buat kebetulan nk buat template baru boleh la saya guna tutorial ni hehe TQ :)

    ReplyDelete
  3. @Jue Jaynee boleh faham tak? risau juga org tak faham sebab sy tak biasa buat tutorial

    ReplyDelete
  4. @D i n yeke...nanti dah boleh la tengok template baru yek... mesti cantik

    ReplyDelete
  5. pening la..byk kli dh try xjdi2 gk

    ReplyDelete
  6. @syazrah tarmin boleh tau tak, bahagian mana yg tak boleh tu? masa nak amik link page ke?

    ReplyDelete
  7. terima kasih tutorialnya ... (:

    ReplyDelete
  8. kenapa kat page show as tu xde kat blog kami....

    ReplyDelete
    Replies
    1. ni tutorial lama sblm blogger.com update. skang page sama format dgn post

      Delete