Dalam kebanyakan kasus saat menata menu navigasi WordPress, Anda bisa menambahkan kelas CSS dari panel admin WordPress. Baru-baru ini saat mengerjakan sebuah proyek, kami menemukan diri kami dalam situasi yang merepotkan. Kami ingin menambahkan kelas khusus ke item menu tertentu hanya pada satu halaman posting. Setelah melihat-lihat sebentar, kami tidak dapat menemukan solusinya. Upaya terakhir kami adalah bertanya di twitter. Otto (@ Otto42) menjawab dengan mengatakan itu mungkin dengan menggunakan filter, namun tidak ada dokumentasi untuk filter.
Setelah melihat intinya untuk sementara, kami menemukan solusinya. Yang perlu anda lakukan adalah menempelkan kode berikut di file functions.php anda:
// Menyaring Kelas di Item Menu Navigasi
add_filter ('nav_menu_css_class', 'special_nav_class', 10, 2);
fungsi special_nav_class ($ classes, $ item) {
if (is_single () && $ item-> title == 'Blog') {
$ classes [] = 'current-menu-item';
}
kembali $ kelas;
}
Kode di atas hanya memeriksa apakah itu adalah satu halaman posting, dan judul item menu adalah Blog. Jika kriteria itu sesuai, maka itu adalah menambahkan sebuah kelas “Current-menu-item”. Kami perlu menambahkan kelas khusus agar bisa bekerja dengan desain yang sedang kami kerjakan.
Jika Anda belum bisa mengatakannya, pada dasarnya apa yang ingin kita lakukan adalah menyimpan barang blog yang disorot dalam menu saat pengguna berada di satu pos. Hal ini memungkinkan mereka untuk melihat bahwa satu posting adalah bagian dari blog. Ini biasanya tidak masuk akal, tapi dalam desain yang sedang kita kerjakan, itu masuk akal.
Jika Anda putus asa mencari kode ini, kami harap artikel ini membantu. Anda dapat memeriksa variabel $ item lainnya juga. Beberapa contohnya adalah: $ item-> ID, $ item-> title, $ item-> xfn
Quick Edit: Setelah memposting artikel ini di twitter, salah satu pengguna kami @dbrabyn menunjukkan bahwa kami dapat dengan mudah menyelesaikannya dengan kelas CSS Body. Sebagai contoh:
.single #navigation .leftmenublog div {display: inline-block! important;}
Pada dasarnya apa yang kami lakukan adalah menambahkan div tambahan untuk menampilkan ikon panah ke menu kami. Panah ini hanya akan ditampilkan jika kelas melayang, atau dipilih. Jika tidak, itu ditetapkan untuk ditampilkan: tidak ada; Dengan menggunakan body class, kita hanya membuat tampilan div element hanya untuk kelas menu tertentu.