Sa karamihan ng mga kaso kapag naka-istilong WordPress navigation menu, maaari kang magdagdag lamang ng mga klase sa CSS mula sa WordPress admin panel. Kamakailan lamang habang nagtatrabaho sa isang proyekto, natagpuan namin ang aming sarili sa isang mahirap na sitwasyon. Nais naming magdagdag ng isang pasadyang klase sa isang partikular na item sa menu lamang sa iisang pahina ng post. Pagkatapos ng pagtingin sa paligid para sa isang habang, hindi namin mahanap ang anumang solusyon. Ang aming huling resort ay upang magtanong sa nerbiyos. Sumagot ang Otto (@ Otto42) sa pagsasabi na posible ito sa pamamagitan ng paggamit ng mga filter, ngunit walang dokumentasyon para sa filter.
Pagkatapos ng pagtingin sa core para sa isang habang, namin korte ang solusyon. Ang kailangan mong gawin ay i-paste ang sumusunod na code sa iyong functions.php file:
/ Pag-filter ng Isang Klase sa Item ng Menu ng Pag-navigate
add_filter ('nav_menu_css_class', 'special_nav_class', 10, 2);
function na special_nav_class ($ classes, $ item) {
kung (is_single () && $ item-> title == 'Blog') {
$ classes [] = 'kasalukuyang-menu-item';
}
bumalik $ klase;
}
Ang code sa itaas ay pagsuri lamang kung ito ay isang solong pahina ng post, at ang pamagat ng item sa menu ay Blog. Kung ang pamantayan ay naitugma, pagkatapos ay nagdaragdag ito ng isang “Kasalukuyang-menu-item” na klase. Kailangan naming magdagdag ng isang pasadyang klase upang magawa ito sa disenyo na ito na aming ginagawa.
Kung hindi mo masabi na, talaga kung ano ang gusto naming gawin ay panatilihin ang naka-highlight na item sa blog sa menu kapag ang user ay nasa isang post. Pinapayagan nito ang mga ito na makita na ang mga solong post ay bahagi ng blog. Karaniwan na ito ay hindi makatwiran, ngunit sa disenyo na ginagawa namin, ito ay may katuturan.
Kung ikaw ay desperadong naghahanap ng code na ito, inaasahan naming nakatulong ang artikulong ito. Maaari mo ring suriin ang iba pang mga variable ng item ng $. Ang ilang mga halimbawa ay: $ item-> ID, $ item-> pamagat, $ item-> xfn
Mabilis na I-edit: Pagkatapos i-post ang artikulong ito sa nerbiyos, isa sa aming mga gumagamit @ dbrabyn itinuturo na maaaring madali naming magawa ito sa mga klase sa CSS Body. Halimbawa:
.single #navigation .leftmenublog div {display: inline-block! important;}
Talaga kung ano ang ginawa namin ay idinagdag ng isang karagdagang div upang ipakita ang isang icon ng arrow sa aming menu. Ang arrow na ito ay ipapakita lamang kung ang klase ay alinman sa hovered sa, o napili. Kung hindi, itakda ito upang ipakita: wala; Sa pamamagitan ng paggamit ng klase ng katawan, ginawa lang namin ang display ng elemento ng div para lamang sa partikular na klase ng menu.