FTP (File Transfer Protocol)<\/strong>. Kami merekomendasikan cara ini kalau Anda menggunakan editor teks khusus. Namun, hanya ada satu snippet kode yang perlu ditambahkan, jadi editor kode bawaan WordPress saja sudah cukup.<\/p>Scroll ke bagian akhir file, lalu tambahkan kode berikut:<\/p>
function wpb_custom_new_menu() {\n register_nav_menu('custom-menu',__( 'Custom Menu' ));\n}\nadd_action( 'init', 'wpb_custom_new_menu' );<\/pre>Anda perlu memodifikasi slug custom-menu<\/strong> dan nama menu, yang akan digunakan sebagai kolom Custom Menu<\/strong>. Namun, Anda bisa memberi nama apa pun untuk menu kustom.<\/p>Simpan perubahan yang dibuat pada file functions.php. Sekarang saatnya mengedit item yang akan disertakan dalam menu baru Anda.<\/p>
Langkah 2: Edit Menu WordPress Kustom Anda<\/h3> Untuk mengedit menu kustom yang baru, buka Appearance → Menu<\/strong>. Cari bagian Menu Settings<\/strong> di bagian kanan bawah layar.<\/p>Bagian tersebut akan mencakup lokasi menu baru yang Anda masukkan pada langkah pertama (Custom Menu).<\/p>
\n
Untuk mengedit item apa saja yang akan ditampilkan di lokasi tersebut, pilih menu menggunakan opsi Select a menu to edit:<\/strong> atau buat yang baru.<\/p>Setelah itu, pilih elemen yang ingin Anda sertakan dalam menu menggunakan daftar di sebelah kiri dan urutkan di bagian Menu structure<\/strong>.<\/p>\n
Setiap item menu akan menyertakan nama tampilan dan link. Apabila sudah puas dengan hasilnya, pastikan bahwa menu kustom baru Anda sudah aktif pada Menu Settings. Kalau sudah, simpan perubahan Anda.<\/p>
Pada tahap ini, Anda sudah punya menu siap pakai yang tadi dimasukkan ke tema website. Meski begitu, menu tidak akan muncul hingga Anda menerapkan fungsi wp_nav_menu untuk menentukan lokasinya.<\/p>
Tambahkan fungsi wp_nav_menu dalam template halaman untuk meletakkan menu kustom. File template halaman yang bisa diakses akan bergantung pada tema yang Anda gunakan.<\/p>
Buka Appearance → Theme File Editor<\/strong> untuk mengakses file ini di dashboard. Bagian Theme Files<\/strong> di sebelah kanan menampilkan daftar seluruh file yang bisa Anda edit dari layar ini.<\/p>\n
Dalam contoh ini, kami memilih template tema yang berisi satu halaman. Berikut adalah kode yang perlu Anda tambahkan ke template:<\/p>
<?php\nwp_nav_menu( array( \n 'theme_location' => 'custom-menu', \n 'container_class' => 'menu-class'\n 'fallback_cb' => ‘wp_page_menu’ ) ); \n?><\/pre>Sebelum menyimpan perubahan ke file template, jangan lupa untuk mengupdate placeholder dengan slug tema kustom dan parameter lain yang ingin Anda gunakan. Kami menyertakan parameter container_class<\/strong> dan fallback_cb<\/strong> dalam contoh ini.<\/p>Namun, Anda bisa menggunakan kode singkat seperti berikut:<\/p>
<?php\nwp_nav_menu( array( \n 'theme_location' => 'custom-menu' ) ); \n?><\/pre>Posisi kode akan menentukan lokasi menu di halaman. Kalau belum paham cara kerja penentuan posisi ini, Anda bisa mencoba lokasi yang berbeda dalam file template.<\/p>
Sebaiknya jangan mengubah bagian kode lainnya saat mengedit file template, kecuali Anda memang paham fungsinya. Karena hanya menambahkan beberapa baris kode, Anda bisa menghapusnya kalau terjadi error.<\/p>
Setelah mengedit, cek tampilan menu dengan mengunjungi salah satu halaman yang menggunakan template buatan Anda tadi. Kalau menu tidak muncul, mungkin ada error pada slug parameter theme_location. Kalau begini, coba buka dan cek kembali, ya.<\/p>
Kesimpulan<\/h2> Meskipun bisa membuat menu kustom dengan mudah di WordPress, Anda tidak bisa menentukan lokasinya<\/strong>.<\/p>Di sinilah fungsi wp_nav_menu<\/strong>, yang memungkinkan Anda bebas meletakkan menu kustom yang dibuat menggunakan register_nav_menu<\/strong> di bagian mana pun pada website Anda.<\/p>Berikut ringkasan cara menggunakan fungsi wp_nav_menu WordPress:<\/p>
\nBuat menu kustom menggunakan fungsi register_nav_menu.<\/li>\n\n\n\n Edit menu WordPress kustom Anda.<\/li>\n\n\n\n Gunakan fungsi wp_nav_menu untuk menampilkan menu baru tersebut.<\/li>\n<\/ol>Punya pertanyaan terkait penggunaan fungsi wp_nav_menu di WordPress? Sampaikan melalui kolom komentar di bawah ini, ya!<\/p>\n","protected":false},"excerpt":{"rendered":"
Menu merupakan salah satu elemen paling umum pada website. Di WordPress, Anda bisa membuat menu kustom dengan mudah dan memilih tampilannya sesuai tema saat ini. Namun untuk meletakkan menu di lokasi tertentu, Anda perlu mengedit file tema dan menambahkan fungsi wp_nav_menu. Dengan memadukan fungsi wp_nav_menu dan register_nav_menu, Anda bisa membuat dan meletakkan menu di mana […]<\/p>\n
Read More…<\/a><\/p>\n","protected":false},"author":190,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"rank_math_title":"","rank_math_description":"Fungsi wp_nav_menu bisa Anda gunakan untuk membuat menu kustom di WordPress. Mau tahu caranya? Cari tahu selengkapnya di artikel ini yuk!","rank_math_focus_keyword":"wp_nav_menu","footnotes":""},"categories":[4859],"tags":[],"class_list":["post-26623","post","type-post","status-publish","format-standard","hentry","category-wordpress"],"hreflangs":[{"locale":"en-US","link":"https:\/\/www.hostinger.com\/tutorials\/how-to-use-wp-nav-menu-in-wordpress","default":0},{"locale":"pt-BR","link":"https:\/\/www.hostinger.com\/br\/tutoriais\/wp_nav_menu","default":0},{"locale":"fr-FR","link":"https:\/\/www.hostinger.com\/fr\/tutoriels\/creer-menu-personnalise-avec-wp_nav_menu-wordpress","default":0},{"locale":"id-ID","link":"https:\/\/www.hostinger.com\/id\/tutorial\/wp_nav_menu","default":0},{"locale":"en-UK","link":"https:\/\/www.hostinger.com\/uk\/tutorials\/wp_nav_menu","default":0},{"locale":"en-MY","link":"https:\/\/www.hostinger.com\/my\/tutorials\/how-to-create-a-custom-menu-using-wordpress-wp_nav_menu-function","default":0},{"locale":"en-PH","link":"https:\/\/www.hostinger.com\/ph\/tutorials\/how-to-create-a-custom-menu-using-wordpress-wp_nav_menu-function","default":0},{"locale":"pt-PT","link":"https:\/\/www.hostinger.com\/pt\/tutoriais\/wp_nav_menu","default":0},{"locale":"en-IN","link":"https:\/\/www.hostinger.com\/in\/tutorials\/wp_nav_menu","default":0},{"locale":"en-CA","link":"https:\/\/www.hostinger.com\/ca\/tutorials\/how-to-use-wp-nav-menu-in-wordpress","default":0},{"locale":"en-AU","link":"https:\/\/www.hostinger.com\/au\/tutorials\/how-to-use-wp-nav-menu-in-wordpress","default":0},{"locale":"en-NG","link":"https:\/\/www.hostinger.com\/ng\/tutorials\/how-to-use-wp-nav-menu-in-wordpress","default":0}],"_links":{"self":[{"href":"https:\/\/www.hostinger.com\/id\/tutorial\/wp-json\/wp\/v2\/posts\/26623","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.hostinger.com\/id\/tutorial\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.hostinger.com\/id\/tutorial\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.hostinger.com\/id\/tutorial\/wp-json\/wp\/v2\/users\/190"}],"replies":[{"embeddable":true,"href":"https:\/\/www.hostinger.com\/id\/tutorial\/wp-json\/wp\/v2\/comments?post=26623"}],"version-history":[{"count":7,"href":"https:\/\/www.hostinger.com\/id\/tutorial\/wp-json\/wp\/v2\/posts\/26623\/revisions"}],"predecessor-version":[{"id":29067,"href":"https:\/\/www.hostinger.com\/id\/tutorial\/wp-json\/wp\/v2\/posts\/26623\/revisions\/29067"}],"wp:attachment":[{"href":"https:\/\/www.hostinger.com\/id\/tutorial\/wp-json\/wp\/v2\/media?parent=26623"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.hostinger.com\/id\/tutorial\/wp-json\/wp\/v2\/categories?post=26623"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.hostinger.com\/id\/tutorial\/wp-json\/wp\/v2\/tags?post=26623"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}
![\"\"](\"https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/37\/2024\/06\/ID-New-WP_in-text-banner.png\/public\")
<\/a><\/figure><\/div>![\"\"](\"https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/37\/2022\/11\/file-functions.php-dibuka-di-wordpress.png\/public\")
<\/figure><\/div>![\"\"](\"https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/37\/2022\/11\/mengedit-menu-kustom-yang-baru-dibuat-dengan-wp_nav_menu-di-pengaturan-menu-wordpress.png\/public\")
<\/figure><\/div>![\"\"](\"https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/37\/2022\/11\/menambahkan-item-menu-dan-mengubah-struktur-menu-kustom-di-wordpress.png\/public\")
<\/figure><\/div>![\"\"](\"https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/37\/2022\/11\/mengedit-file-page.php_.png\/public\")
<\/figure><\/div>