Tutorial #3.1: Cara Membuat Sub Menu Pada Main Menu Blog

Sebelum ini telah dikongsikan bagaimana membuat design menu dalam Tutorial #3 – Cara Membuat Menu Utama Pada Blog.

Hari ini kita upgrade sedikit tutorial kita sebelum ini dengan menambah cara-cara untuk membuat sub-menu atau tambahan dropdown menu pada menu utama pada blog kita.

 

Seperti contoh berikut:

Tutorial-Sub-Menu

Heirarki ‘three tier’ menu yang akan kita design adalah berdasarkan contoh imej menu di atas:

Langkah #1 – Membuat Page ‘Senarai Produk’

  1. Sepatutnya page ini sudah ada jika anda mengikuti Tutorial #3 dengan sempurna.
  2. Jika tiada, melalui Admin Dashboard >> Pages >> Add New
  3. Namakan header page sebagai ‘Senarai Produk’ atau ‘Senarai Produk Shaklee’ atau ‘Produk Shaklee’ atau sebagainya yang difikirkan sesuai.
    • Lebih pendek lebih jimat ruang tab menu.

Langkah #2 – Membuat Senarai Page Untuk Produk Secara Spesifik

  1. Lagi sekali, dari Admin Dashboard pergi ke Pages >> Add Newadd-new-pages
  2. Namakan page secara spesifik dan tekan butang ‘Publish’ bagi setiap page mengikut nama produk seperti senarai berikut:
    • Nutrisi Asas
    • Sustained Release Vita-C
    • Vita-Lea
    • Alfalfa
    • B-Complex
    • Penjagaan Berat Badan
    • Cinch Shake Mix
    • Cinch Energy Tea Mix
    • Anti-Penuaan
    • Vivix
  3. Jika dah siap, boleh semak senarai page yang telah dibuat dalam Pages >> All Pages
    • Pastikan anda ada senarai nama 10 page di atas.

Langkah #3 – Membuat nama ‘Menu Utama’ 

  1. Sepatutnya ‘Menu Utama’ ini sudah ada jika anda mengikuti Tutorial #3 dengan sempurna.
  2. Jika belum ada, akses ke Appearance >> Menus.
  3. Isikan nama ‘Menu Utama’ dalam petak ‘Menu Name’
  4. Klik butang ‘Create Menu’

Langkah-2

Langkah #4 – Membuat Sub-Menu Design

  1. Untuk membuat design menu, kita boleh akses ke bahagian Appearance >> Menus
  2. Lihat pada petak ‘Pages’ sebelah kiri, ‘Tick’ semua page yang kita buat dalam langkah #2 di atas tadi.
  3. Klik butang ‘Add to Menu’ dan lihat senarai pages yang di transfer ke petak ‘Menu Structure’ menjadi tab menu.Add-to-menu
  4. Susunkan senarai menu dalam ‘Menu Structure’ mengikut hierarki kategori yang diinginkan (rujuk heirarki three-tier di atas) seperti dalam gambarajah di bawah.
    • Bawa pointer mouse ke menu, akan automatik keluar imej ‘Drag’. Klik dan hold untuk drag menu ke mana-mana baris secara vertikal (untuk create priority list) atau ke kanan dan ke kiri secara horizontal (untuk create sub menu).susun-struktur-menu
  5. ‘Tick’ petak primary menu untuk set menu yang anda design sebagai priority menu yang akan dipaparkan pada header blog anda.
  6. Jika telah siap, tekan butang ‘Save Menu’ pada penjuru kanan petak ‘Menu Structure’ sama ada di atas atau bawah.

Langkah #5 – Lihat Hasil Paparan Design Menu

  1. Pergi ke blog anda untuk lihat hasil langkah #1 ~ #4 di atas.
  2. Jika ingin membuat sebarang perubahan atau pembetulan, pergi ke Dashboard >> Appearance >> Menus
  3. Lakukan penambahbaikan dan lihat semula blog anda dan klik ‘Refresh’ untuk update.
  4. Jika tiada sebarang masalah, tutorial #3.1 tamat sehingga di sini. Sebarang masalah, komen atau cadangan, boleh tuliskan di ruangan komen di bawah.
  5. Terima Kasih.

Mudahnya Membina Blog‘ by Masterjie

5 Comments

Add a Comment

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.