Cara Membuat Menu Dinamis Di WordPress

WordPress adalah sistem manajemen konten (CMS) yang memungkinkan Anda membuat situs web atau blog dari awal, atau meningkatkan situs web yang sudah ada. Pada artikel ini, kami akan menunjukkan cara membuat menu dinamis di WordPress. Menu dinamis adalah menu yang berubah sesuai dengan halaman yang Anda lihat. Misalnya, jika Anda melihat halaman tentang "Tema WordPress", menu akan menampilkan tautan ke halaman lain tentang Tema WordPress. Jika Anda melihat halaman tentang “Plugin WordPress”, menu akan menampilkan tautan ke halaman lain tentang Plugin WordPress. Membuat menu dinamis di WordPress itu mudah. Pertama, Anda perlu membuat menu. Kedua, Anda perlu menambahkan item ke menu. Ketiga, Anda perlu menetapkan menu ke lokasi. Keempat, Anda perlu menambahkan kode ke tema WordPress Anda. Mari kita mulai dengan langkah pertama: membuat menu.

Di Bagian 2 dari seri ini, kita melangkah lebih jauh dengan membuat menu navigasi dinamis. Anda akan mempelajari cara membuat menu bersyarat berdasarkan lokasinya di Blok Visibilitas dengan menggunakan add-on Pro. Tema blok digunakan untuk membuat bagian template yang didasarkan pada prinsip blok. Tutorial ini akan memandu Anda melalui langkah-langkah yang diperlukan untuk membuat menu navigasi sekunder pada halaman “Wiking Excursions”. Ini semudah mengklik Editor Situs untuk mengedit tajuk situs web. Menggunakan kontrol Lokasi di plugin Blok Visibilitas, kami juga dapat membatasi lokasi menu sekunder. Di Basis Pengetahuan, pilih opsi Lokasi lalu klik ikon elipsis untuk mengaktifkannya.

Kami sekarang dapat membatasi visibilitas blok ke halaman Wisata Mendaki dengan menggunakan Kontrol lokasi, yang memungkinkan kontrol lebih besar atas visibilitas. Aturan Post menginstruksikan kita untuk memilih jenis posting Halaman serta jenis halaman 'Hiking'. Dalam pengaturan aturan yang dihasilkan, berikut ini harus diikuti. Di beranda situs demo kami, kami akan dapat mengakses menu bersyarat baru. Sisa dari artikel ini harus diselesaikan. Anda dapat mencapai ini dengan menggunakan berbagai aturan dan set aturan. Untuk demo ini, kami memilih contoh langsung.

Untuk membuat menu baru, buka Appearance. Klik "Buat Menu" jika Anda ingin membuat menu sekunder, "Menu Kustom Saya" jika Anda ingin membuat menu khusus untuk lokasi tertentu, dan "Menu Sekunder" jika Anda ingin membuat menu sekunder untuk lokasi lain. Setelah Anda menambahkan beberapa item ke menu, simpan (misalnya, item Menu 1, item Menu 2, dan item Menu 3).

Bagaimana Cara Membuat Menu Dinamis Di Tema Kustom WordPress?

Salah satu cara untuk membuat menu dinamis di WordPress adalah dengan menggunakan fungsi wp_nav_menu. Fungsi ini memungkinkan Anda untuk membuat menu yang dibuat secara otomatis berdasarkan struktur situs web Anda. Anda juga dapat menggunakan fungsi ini untuk membuat menu kustom yang khusus untuk tema Anda.

Dengan mengikuti langkah-langkah ini, Anda dapat membuat menu navigasi yang sederhana dan dinamis di WordPress. Langkah utama adalah mendaftarkan menu navigasi dengan menggunakan fungsi register_nav_menus(). Untuk menjalankan ini, Anda harus terlebih dahulu mendaftarkannya di file functions.php di tema anak Anda dan kemudian menggunakan kait 'init'. Dalam contoh ini, kita akan memanfaatkan menu header utama. Plugin Nav Menu tersedia di WordPress.org dan memungkinkan Anda untuk menetapkan menu yang berbeda untuk pengguna yang berbeda berdasarkan peran mereka. Kita juga bisa menggunakan plugin ini untuk mendaftarkan beberapa menu sekaligus. Pada langkah sebelumnya, kita dapat menata menu navigasi berdasarkan desain situs dengan mereferensikan kelas CSS khusus dalam pemanggilan fungsi WP_nav_menu.

Cara Membuat Menu Header Dinamis Di WordPress

Untuk membuat menu header dinamis di WordPress, Anda harus terlebih dahulu membuat menu kustom. Untuk melakukan ini, buka bagian Menu di panel admin WordPress dan klik tautan buat menu baru. Masukkan nama untuk menu Anda dan klik tombol buat menu. Selanjutnya, Anda perlu menambahkan item ke menu Anda. Untuk melakukan ini, klik tautan tambahkan item dan pilih halaman atau posting yang ingin Anda tambahkan ke menu Anda. Setelah Anda menambahkan semua item yang Anda inginkan, klik tombol simpan menu. Menu header dinamis Anda sekarang siap digunakan.

Jika kita membuat halaman menu dinamis dengan Metode Halaman Menu Dinamis WordPress, yang dijelaskan nanti dalam tutorial ini, kita akan dapat mengubahnya. Pada navigasi utama, gambar latar digunakan untuk mengubah posisi item menu berdasarkan ID-nya. Penggunaan tag "span" akan memungkinkan kita untuk menyembunyikan teks untuk melihat gambar latar belakang seperti yang kita lihat. Kode yang akan kita gunakan dihasilkan secara dinamis oleh WordPress, menggunakan kelas khusus yang disebut current_page_ancestor, jadi seharusnya terlihat seperti ini: Tidak ada lagi yang dikatakan. Jika kita ingin menambah jumlah sub halaman, cukup tambahkan atau kurangi pengaturan depth=2 sehingga menampilkan jumlah halaman yang tidak terbatas. Menggunakan CSS, tautan halaman saat ini, seperti yang ditunjukkan pada gambar di bawah, sekarang sangat sederhana untuk ditampilkan dalam huruf tebal. Navigasikan ke halaman induk dengan bagian yang disorot. Sorot halaman anak dari orang tua.

WordPress Menambahkan Item Menu Secara Dinamis

Menambahkan item menu ke menu WordPress dapat dilakukan baik melalui dashboard admin WordPress atau dengan menambahkan kode ke tema Anda. Jika Anda ingin menambahkan item menu ke menu yang ada, cukup login ke situs WordPress Anda dan arahkan ke halaman “Appearance > Menus”. Dari sana, Anda dapat menambahkan item menu baru dengan memilihnya dari sisi kiri dan mengklik tombol "Tambahkan ke Menu". Jika Anda ingin menambahkan item menu melalui kode, Anda perlu menambahkan beberapa baris kode ke file functions.php tema Anda. Hal pertama yang perlu Anda lakukan adalah membuat fungsi baru yang akan menambahkan item menu. Fungsi ini dapat diberi nama apa pun yang Anda inginkan, tetapi kami akan menyebutnya “my_custom_menu_items()”. Di dalam fungsi ini, Anda harus menggunakan kait filter “wp_nav_menu_items” WordPress. Kait ini memungkinkan Anda untuk menambahkan item baru ke menu yang sudah ada. Kode di dalam fungsi Anda akan terlihat seperti ini: function my_custom_menu_items( $items, $args ) { // Lakukan sesuatu dengan $items return $items; } add_filter( 'wp_nav_menu_items', 'my_custom_menu_items', 10, 2 ); Kode di atas akan menambahkan fungsi baru yang dapat digunakan untuk menambahkan item ke menu yang ada. Fungsi itu sendiri belum melakukan apa-apa, tetapi menyediakan kerangka kerja yang dapat Anda gunakan untuk menambahkan item menu kustom Anda sendiri. Untuk benar-benar menambahkan item menu, Anda harus memodifikasi kode di dalam fungsi agar sesuai dengan kebutuhan Anda. Misalnya, jika Anda ingin menambahkan tautan ke halaman “Tentang”, Anda akan menggunakan kode berikut: function my_custom_menu_items( $items, $args ) { $items .= 'About'; kembalikan $item; } add_filter( 'wp_nav_menu_items', 'my_custom_menu_items', 10, 2 ); Kode di atas akan menambahkan tautan baru ke menu Anda dengan teks "Tentang". Anda dapat menambahkan item menu sebanyak yang Anda inginkan dengan menambahkan baris kode tambahan di dalam fungsi.

Plugin Menu Dinamis WordPress

Plugin menu dinamis WordPress adalah cara yang bagus untuk menambahkan sedikit bumbu ke navigasi situs web Anda. Dengan mengizinkan Anda membuat menu yang berubah berdasarkan apa yang dilihat pengunjung, Anda dapat membuat mereka tetap terlibat dan kembali lagi.

Cara Membuat Menu Kustom Di WordPress

Untuk membuat menu khusus di WordPress, Anda harus menavigasi ke bagian "Tampilan" di dasbor dan memilih opsi "Menus". Dari sana, Anda dapat membuat menu baru dan menambahkan halaman, kategori, atau tautan khusus yang diinginkan. Setelah Anda menyimpan perubahan, Anda kemudian dapat menetapkan menu yang baru dibuat ke lokasi di situs web Anda melalui tab “Kelola Lokasi”.

Vegibit memberi Anda pemahaman tentang cara membuat tema WordPress. Menu akan berada di bawah nama situs dan area tagline, tetapi akan lebih tinggi dari konten situs. Agar menu muncul, pertama-tama kita harus mendaftarkan lokasi di file functions.php tema. Buat menu kustom kami di Dasbor WordPress. Sekarang kita perlu mendaftarkan menu baru kita dengan inti WordPress. Dengan fitur ini, sekarang kita dapat mengatur lokasi dashboard. Kami ingin terlihat seolah-olah berasal langsung dari fungsi WordPress_nav_menu().

Pada langkah selanjutnya, kami akan menautkan ke seluruh daftar kategori. Anda mungkin dapat mencapai efek hover jika Anda menggerakkan mouse ke setiap tautan. Untuk memahami bagaimana ini akan bekerja, kami telah membuat file style.css. Kami ingin menghapus garis bawah untuk tautan dan poin-poin dari setiap elemen dalam daftar kami, serta menghapus padding dan margin dari setiap elemen. Di Ringkasan WordPress, Anda akan menemukan prosedur langkah demi langkah untuk membuat menu kustom. Ini adalah penjelasan yang sangat baik tentang cara menggunakan menu kustom dalam tema WordPress. Tugas kami menjadi lebih mudah berkat beberapa fungsi WordPress. Setelah menu baru ditautkan ke WordPress, mudah untuk menambahkan atau menghapus semua jenis konten yang kita inginkan dari menu itu.

Membuat Menu Kustom Di WordPress

Setelah membuat menu Anda, pergi ke Appearance. Anda akan dapat melihat menu baru di halaman menu. Segera setelah Anda memilihnya, Anda dapat menyesuaikannya sesuai keinginan Anda.