Friday, March 28, 2014

Cara Buat Dan Edit Children Class (Sub-menu) Advance Template

Pertama sekali saya tunjuk menggunakan contoh yang saya buat kat blog saya..dalam kes ni, saya nak tambah sub menu bagi SET B untuk letak testimoni set B


Pertama sekali saya view kesemua testimoni set menyusu yang saya ada menggunakan label testimoni set menyusu..dari sini senang saya nak cari yang mana testimoni yang menggunakan set B sebab set menyusu ada 5..set B ni salah satu darinya je..after dah buat semakan..saya ada 3 testimoni untuk set menyusu set B dari keseluruhan 9 testimoni set menyusu

Seterusnya masuk ke dashboard > Template > HTML..dengan menggunakan fungsi search iaitu CTRL+F saya cari kod untuk menu set B tersebut..so ini step by stepnya 1- Copy kod yang saya highlight iaitu opening class=children 2- Disebabkan kita nak tambah sub menu pada menu set B, maka kita perlu letak kod children class tu dalam lingkungan kod set B dengan cara menambah kod baru diantara </a> dan </li>...so saya sediakan ruang untuk paste kod yang kita dah copy tadi untuk paste

Lepas tu paste..selepas paste anda akan perasan kod closing tag </li> berubah warna jadi merah..ni sebab HTML anda tidak lengkap..apa yang tertinggal?

setiap opening tag perlu diakhiri dengan closing tag..dalam kes ni kita dah copy paste opening tag untuk <ul>..tapi takda pasangannya </ul>

Apa yang perlu dilakukan adalah simply tambah closing tag </ul> dan </li> berwarna merah tadi akan kembali berwarna hijau kerana HTML anda lengkap
Lepas dah paste, kita sediakan lagi ruang untuk copy paste kod baru..kali ni kita copy atau create kod baru untuk structure sub menu baru..bermula dengan <li> diakhiri dengan </li>

Untuk menu baru ni, anda ada 2 pilihan..
1- Taip kod
2- Copy paste

Dalam contoh ni saya guna pilihan pertama iaitu taip kod..untuk tambah menu baru..kod dia <li> Untuk structure menu baru <a href=''> untuk isi kandungan dalam structure menu baru tu..href merujuk kepada link yang akan kita letak..perkataan diantara <a> dan </a> pula adalah perkataan yang akan kelihatan dalam structure menu baru tersebut..dalam kes ni perkataan TESTIMONI 1 </a> adalah closing tag <a href=''> </li> adalah closing tag <li>

Jika anda pilih copy paste dari kod menu lain pun boleh..kita just tukar link didalamnya beserta perkataan untuk menu baru tu je...saya biasanya copy paste je sebab cepat..kalau nak copy pastikan copy bermula <li> hingga </li>

So saya pergi pada ENTRI testimoni set menyusu set B yang pertama dan copy link tersebut...SILA BEZAKAN APA ITU ENTRI..APA ITU LABEL..entri adalah single atau satu entri...label pula adalah koleksi beberapa entri dengan label yang sama..penting untuk faham konsep ni ye sebab anda sukar nak buat ni semua jika tak faham term dan konsep

Lepas dah copy, paste link tersebut DALAM kurungan ' dan '...apa nama ni? koma di atas ek? tak kisah la apa nama dia..janji anda faham..kalau xda koma di atas ni kod anda tak jadi tau..

Lepas dah save boleh view template..refresh semula lepas blog habis saving..kalau blog tengah saving anda refresh..menu baru ni belum kelihatan tau

So tadi saya cerita saya ada 3 testimoni set B..just simply tambah lagi 2 kod yang sama tapi berlainan link dan perkataan..tengok gambar kalau tak faham

Ini hasil akhir...simple kan? macam kacang..hehe..kalau tak faham tanya saya...sebab saya belajar benda ni xda orang ajar..saya guna logik akal dan analisis kod..dan sikit-sikit saya google nak faham apa maksud kod...saya xda formal lesson belajar benda ni...semua belajar sendiri...jika saya yg belajar sendiri boleh buat...anda yang saya ada untuk ajar mesti lebih cepat belajar...logik kan?..ok saya nak g pasar malam jap
  

0 comments:

Post a Comment

Link Within

Related Posts Plugin for WordPress, Blogger...