Cara Membuat Struktur Menu Kustom di WordPress
Diterbitkan: 2015-07-22WordPress memiliki struktur navigasi bawaan otomatis yang membuat menu untuk Anda. Ini termasuk halaman dan kategori. Ini akan menempatkan mereka di menu utama Anda tanpa Anda harus melakukan apa pun selain membuat halaman atau posting dalam kategori. Ini berfungsi dengan baik jika Anda hanya memiliki beberapa halaman dan kategori, tetapi setelah beberapa saat itu bisa mulai tidak terkendali. Juga, hanya karena dapat menangani navigasi Anda secara otomatis tidak berarti Anda harus membiarkannya.
WordPress akan menangani Anda menu untuk Anda secara otomatis tanpa masukan dari Anda, tetapi jika Anda benar-benar ingin memanfaatkan sepenuhnya struktur menu Anda, Anda dapat membuat menu kustom Anda sendiri. Menu kustom memungkinkan Anda untuk mengambil kendali penuh atas struktur navigasi Anda dan dapat memberikan situs Anda tampilan yang lebih bersih dan lebih profesional.
Jenis Menu
Ada beberapa jenis menu yang berbeda. Jenis menu yang dapat Anda gunakan bergantung pada fitur tema Anda. Jenis menu populer meliputi:
- Menu Utama – yang ini muncul di bawah header. Ini harus mencakup navigasi utama Anda dan halaman yang diharapkan pengunjung Anda berdasarkan jenis situs web yang Anda miliki: beranda, tentang, kontak, blog, portofolio, dll.
- Menu Sekunder – yang ini muncul di atas header. Ini harus mencakup tautan dan halaman yang ingin Anda berikan kepada pembaca Anda di lokasi yang nyaman tetapi tidak harus di struktur navigasi utama Anda. Ini bisa berupa item seperti tutorial, keranjang belanja, dll.
- Sidebar – menu kustom Anda dapat ditempatkan di sidebar menggunakan widget menu kustom. Anda dapat menggunakan widget sebanyak yang Anda inginkan dan menempatkan menu apa pun di dalamnya.
- Footer – Anda dapat membuat menu hanya untuk footer Anda. Menu ini biasanya memiliki lebih sedikit informasi di dalamnya daripada menu utama Anda. Tergantung pada kebutuhan situs Anda, biasanya berisi rumah, tentang, kontak, blog, dll. Jika situs Anda menyertakan posting pekerjaan, program afiliasi, dan situs saudara, mereka juga dapat disertakan di sini.
- Menu Tautan Sosial – ini adalah menu khusus yang ditemukan dalam tema-tema seperti Twenty Fifteen yang menempatkan tautan media sosial Anda di sidebar Anda. Jika tema mengenali jejaring sosial itu akan memberikan ikon yang tepat. Jika tidak, maka nama tersebut akan ditampilkan sebagai teks (sesuai dengan cara Anda memberi label pada tautan).
Menu utama dan sekunder adalah yang paling populer di antara tema WordPress. Apa yang ada di dalamnya sangat tergantung pada fokus situs Anda. Fokus utama situs Anda akan muncul di menu utama. Itu harus masuk akal bagi pengunjung Anda dan menjadi apa yang mereka harapkan untuk dilihat.
Misalnya, jika Anda memiliki toko maka keranjang belanja Anda harus ada di menu utama. Jika Anda memiliki situs portofolio tetapi Anda juga menjual beberapa barang, maka portofolio Anda harus ada di menu utama Anda dan keranjang belanja harus ada di menu sekunder. Pikirkan saja di mana itu cocok secara logis dan tempatkan dengan tepat.
Membuat Menu Kustom Anda Sendiri
WordPress memudahkan untuk membuat menu kustom Anda sendiri dengan tangan. Anda dapat membuat, menyesuaikan, dan menerapkan menu dari bagian belakang, dan Anda dapat memilih menu dari bagian depan untuk melihat dan mengujinya sebelum ditayangkan.
Membuat Menu dari Back End
Di bagian belakang, buka Penampilan dan pilih Menu. Di ujung depan, buka Kustomisasi dan pilih Navigasi.
Pada layar menu pilih buat menu baru, beri nama menu, dan klik tombol Buat Menu.
Sekarang Anda siap untuk mulai menambahkan struktur navigasi. Di sebelah kiri Anda memiliki kotak untuk Halaman, Tautan Kustom, dan Kategori. Anda dapat menggunakan semua ini sebagai tautan di menu khusus Anda. Di tengah Anda memiliki beberapa opsi. Anda dapat mengizinkan semua halaman baru untuk ditambahkan secara otomatis ke struktur menu atau membiarkan ini tidak dicentang jika Anda ingin memiliki kontrol lebih dan memilih halaman dan kategori sendiri.
halaman
Pilih tab Pages di jendela kiri jika belum terbuka. Untuk menambahkan halaman ke menu, pilih semua halaman yang Anda inginkan dan klik Tambahkan ke Menu.
Jika Anda ingin mereka diatur secara berbeda, cukup seret dan lepas item menu yang ingin Anda pindahkan ke lokasi barunya. Anda bahkan dapat menjadikannya sub-item dari item menu lain dengan menyeret dan menjatuhkannya ke kanan di bawah item yang Anda inginkan sebagai sub-item.
Anda dapat memilih panah di sebelah kanan untuk membuka item dan melakukan penyesuaian seperti mengubah nama dan lokasi. Anda juga dapat menghapus item dari struktur menu di sini.
Tautan Khusus
Untuk menambahkan tautan khusus, buka Tautan Khusus di jendela kiri, tambahkan URL yang Anda inginkan, dan pilih Tambahkan ke Menu. Anda dapat membuat tautan apa pun yang Anda inginkan dan menjadikannya bagian dari struktur menu Anda. Ini juga cara Anda membuat tautan untuk menu Tautan Sosial.
Anda kemudian dapat menarik dan melepasnya di tempat yang Anda inginkan dalam struktur menu.
Kategori
Anda memilih dan menambahkan kategori dengan cara yang sama seperti Anda memilih dan menambahkan Halaman di jendela kiri. Mereka akan bertindak dengan cara yang sama seperti halaman dan tautan di menu.
Simpan Menu Anda
Setelah Anda menyukai struktur menu baru Anda, simpan dan kemudian Anda dapat menggunakannya.
Kelola Lokasi
Ada dua cara untuk menggunakan menu Anda dari bagian belakang.
Pengaturan Menu
Di layar tempat Anda membuat menu, ada sekelompok kotak centang di bawah Pengaturan Menu. Anda dapat memilih menu apa saja dan kemudian memilih tempat yang akan digunakan. Anda dapat memilih sebanyak yang Anda inginkan. Jangan lupa untuk menyimpannya.
Kelola Lokasi
Pilih tab Kelola Lokasi. Di sini Anda dapat memilih menu mana yang akan digunakan di kotak drop-down. Anda tidak harus menggunakan semuanya. Salah satu yang telah Anda pilih menu mana yang akan digunakan di mana cukup tekan simpan dan Anda baru saja memperbarui struktur menu Anda.

widget
WordPress juga memiliki widget Menu Kustom yang dapat Anda seret dan lepas ke bilah sisi Anda. Dari sini Anda dapat memilih menu Anda.
Pengujian
Berikut adalah tampilan menu pengujian dan widget bilah sisi saya. Hal berikutnya yang harus dilakukan adalah menguji setiap item untuk memastikannya bekerja dengan lancar dan intuitif. Jangan lupa langkah ini. Sangat penting untuk menguji menu Anda untuk melihat apakah itu berfungsi seperti yang Anda inginkan. Jelas ini bukan judul menu yang harus Anda gunakan di situs web Anda.
Menggunakan Front End untuk Tampilan WYSIWYG
Untuk mengubah struktur menu Anda dari ujung depan, buka Appearance dan pilih Customize. Setelah Anda sampai di ujung depan, pilih Navigasi. Dari sini Anda dapat memilih menu Anda. Keuntungan dari tampilan ini adalah Anda dapat melihat perubahan segera sebelum menyimpannya. Dengan cara ini Anda dapat memutuskan apakah Anda menyukainya sebelum melakukan. Sayangnya sistem ini tidak mengizinkan Anda membuatnya.
Sesuaikan Tampilan dan Nuansa dengan Tema Seperti Divi
Beberapa tema, seperti Divi 2.4 Tema Elegan, memberi Anda alat sehingga Anda dapat membuat penyesuaian pada tampilan dan nuansa menu Anda dari ujung depan dan segera melihat pengaruhnya. Dengan cara ini Anda akan tahu apa yang akan dilihat pengunjung Anda sebelum Anda menyimpannya.
Berikut adalah tampilan penyesuaian menu Divi. Anda dapat membuat penyesuaian yang sama untuk mengubah tampilan dan nuansa untuk setiap item menu.
Menyesuaikan Lebih Jauh – Menggunakan Plugin untuk Memodifikasi Menu Anda
Ada banyak plugin yang tersedia untuk WordPress yang membantu Anda memodifikasi menu kustom Anda dengan fitur, tampilan, dan fungsionalitas baru. Mereka menambahkan banyak penyesuaian CSS, membuatnya responsif, dan bahkan membuatnya lebih cepat. Berikut ini beberapa plugin yang lebih populer.
Widget Wizard Menu Kustom
Plugin gratis ini menambahkan widget menu khusus yang dapat Anda gunakan di bilah sisi atau di konten Anda dengan menggunakan kode pendek. Ini memberi Anda kontrol penuh atas parameter menu Anda dan memungkinkan Anda menggunakan bagian tertentu dari menu kustom Anda. Itu juga menambahkan beberapa kelas khusus.
Anda dapat menampilkan bagian tertentu dari menu atau seluruh menu. Anda juga dapat membuat output bersyarat. Ini akan ditampilkan sebagai datar atau hierarkis sesuai dengan jumlah level yang Anda tentukan. Anda juga dapat memodifikasi output dengan HTML.
Pengaturan untuk widget mudah digunakan. Anda memilih menu dari kotak drop-down dan memilih filter, fallback, output, container, class, link, dan alternatif (ini adalah level kondisi lain). Ini juga memberi Anda kode pendek sehingga Anda dapat menempelkan menu ke konten Anda.
Menu Akordeon Selanjutnya
Plugin ini memungkinkan Anda membuat menu gaya akordeon dengan kontrol penuh atas level menu, warna, animasi, dll., masing-masing dengan pengaturan dan tampilannya sendiri. Anda memiliki kendali atas level dan status font, latar belakang, warna, gambar, dll. Ini mempercepat sistem menu dengan menggunakan cache, menyediakan berbagai jenis animasi, memiliki level menu tak terbatas, dan menyediakan 30 pengaturan.
Saya suka cara menu akordeon bekerja. Anda dapat memperluasnya saat Anda ingin menggunakannya lalu menyembunyikannya untuk memberi Anda tata letak yang lebih bersih saat Anda tidak ingin melihatnya di layar. Plugin ini mudah digunakan dan diatur. Anda membuat menu seperti Anda membuat jenis konten khusus. Anda kemudian dapat menyeret widget ke bilah sisi Anda dan memilih menu dari dalam widget.
Ada juga edisi Pro yang menambahkan tiga tema dan dukungan. Harga mulai dari $29.
Menu Responsif
Plugin gratis ini memiliki 70 opsi untuk menyesuaikan tampilan, rasa, dan tindakan menu Anda. Anda dapat menyesuaikan judul, CSS, tindakan, ukuran, animasi, skrip, dan banyak lagi. Ini berfungsi baik untuk perangkat seluler dan memiliki fitur untuk menarik menu dari satu sisi dan mengatur lokasi menu. Ini bahkan akan mengecilkan CSS dan JavaScript menu Anda. Anda juga dapat menambahkan HTML khusus dan mengimpor/mengekspor pengaturan Anda.
Ada banyak penyesuaian dalam pengaturan tetapi semuanya mudah dipahami dan disesuaikan. Ada juga pengaturan tingkat lanjut tetapi Anda dapat mengabaikannya jika mau. Ini termasuk kode pendek dan Anda bahkan dapat menambahkan kode PHP ke tema Anda jika Anda mau.
Plugin Lain untuk Memodifikasi Menu
Berikut adalah daftar plugin lain yang menurut saya menarik. Mereka menambah atau memodifikasi fitur menu Anda dan memungkinkan Anda mengontrolnya dengan berbagai cara.
- Menu Mega WordPress
- Menu Drop Down CSS3 Mega
- Menu Responsif WP
- Font Keren 4 Menu
- Kode pendek di Menu
- Penampilan Lebih Cepat – Menu
- Menu Makanan dan Minuman
- Menu Ritel Sederhana
- Memurnikan Menu WordPress
- Widget Menuizer
Tips untuk Membuat Struktur Menu yang Hebat
- Gunakan menu Anda untuk menjaga struktur navigasi Anda tetap teratur.
- Gunakan level sesedikit mungkin. Pikirkan dalam hal Primer dan Sekunder.
- Gunakan nama yang masuk akal bagi pembaca tanpa mereka harus menguraikan kode Anda.
- Gunakan metode KISS. Ingat – lebih sederhana lebih baik. Menu harus mudah digunakan dan intuitif.
- Periksa struktur menu situs favorit Anda dan lihat apa yang Anda suka dan tidak suka. Kemudian buat milikmu lebih baik.
Pikiran Akhir
Menambahkan struktur menu kustom Anda sendiri itu mudah dan akan membuat situs WordPress Anda terlihat dan terasa lebih profesional dan akan menjaga struktur Anda agar tidak terlihat acak. Hanya perlu beberapa menit untuk membuat set menu Anda sendiri dan Anda dapat melihatnya dan mencobanya sebelum ditayangkan. Pengunjung Anda akan menghargai struktur menu yang memungkinkan mereka menavigasi situs Anda lebih cepat dan intuitif.
Giliranmu! Sudahkah Anda membuat struktur menu kustom Anda sendiri? Apakah Anda memiliki sesuatu untuk ditambahkan? Apakah Anda menggunakan plugin untuk memodifikasi menu Anda? Beritahu kami tentang hal itu di komentar di bawah.