Setarea elementelor de navigare active atunci când WordPress nu

WordPress face o treabă excelentă subliniind postările standard, paginile sau taxonomiile actuale atunci când le includeți într-un meniu de navigare. Dar când creați o postare personalizată sau o taxonomie particularizată, totul merge bine și navigarea se oprește subliniind pagina curentă. Din fericire există o soluție, puteți specifica manual ce element de meniu se evidențiază atunci când afișați conținut personalizat.


Cum va funcționa acest lucru

Soluția este simplă. Am scris câteva rânduri de cod care creează o pagină de setări, dacă specificați elementele de meniu pe care să le evidențiați pentru fiecare tip de conținut personalizat. Următorul pas este să înlocuiți clasa Walker de navigare implicită WordPress pentru a genera o clasă de evidențiere atunci când este necesar. Simplu și eficient.


Pasul 1 Crearea și utilizarea unui fișier personalizat

Creați un fișier nou numit navigation.php și să o includă din functions.php fişier.

include_once (get_template_directory (). '/navigation.php');

Acum suntem gata să începem cu codul real.


Pasul 2 Crearea paginii de setări

Mai întâi, înregistrați un nou grup de setări pentru a genera o nouă pagină de setări wp-admin. În gol navigation.php introduceți următorul cod.

 add_action ('admin_init', 'ns_register_navigation_settings'); funcția ns_register_navigation_settings () register_setting ('ns_navigation', 'ns_navigation_predefined_values'); 

Apoi generați un nou element de meniu pentru a accesa noua pagină de setări în wp-admin.

 add_action ('admin_menu', 'ns_navigation_options'); funcția ns_navigation_options () add_submenu_page ("teme.php", "meniuri predefinite", "meniuri predefinite", "ediție_opțiuni", "meniu implicite", "meniu_default_page"); 

menu_defaults_page () funcția imprimă pagina de setări din WordPress Admin. Înainte de a imprima intrările formularelor get_option ( 'ms_navigation_predefined_values') solicită valorile stocate în baza de date și le stochează $ ns_navigation_predefined_values ca o matrice.

În acest caz nu există nimic stocat încă, astfel încât valorile să fie goale. Utilizarea settings_field () este necesară pentru imprimarea câmpurilor ascunse și necesare ascunse și pentru manipularea securității. Restul codului imprimă elementele de intrare utilizând valorile din $ ns_navigation_predefined_values.

Pagina cu setări este acum disponibilă, dar este goală. Trebuie să o ocupăm cu toate postările și taxonomiile personalizate disponibile care au fost generate și elementele de meniu disponibile pentru a se potrivi cu aceste valori. Introduceți următorul cod.

 funcția menu_defaults_page () ?> 

$ v) ?>
'ns_navigation_predefined_values ​​['. $ k. ']', 'echo' => 1, 'show_option_none' => __ ('- Selectare'), 'option_none_value' => '0', 'selected' => $ current_dropdown_value [$ k])); ?>


$ v) ?>
'ns_navigation_predefined_values ​​['. $ k. ']', 'echo' => 1, 'show_option_none' => __ ('- Selectare'), 'option_none_value' => '0', 'selected' => $ current_dropdown_value [$ k])); ?>

Pagina cu setări este acum creată, dar trebuie încă să definim funcțiile numite în codul de mai sus. Introduceți următorul cod.

 funcția ns_get_post_types () $ post_types = get_post_types (array ('public' => true, '_builtin' => false), 'obiecte'); foreach ($ post_types ca $ k => $ v) $ ns_registered_post_types -> $ k = $ v-> etichete-> nume;  return $ ns_registered_post_types;  funcția ns_get_taxonomies () $ taxonomies_types = get_taxonomies (array ('public' => true, '_builtin' => false), 'obiecte'); ($ taxonomies_types ca $ k => $ v) $ ns_registered_taxonomies_types -> $ k = $ v-> etichete-> nume;  returnați $ ns_registered_taxonomies_types; 

Functia ns_get_post_types preia toate tipurile de posturi disponibile și scoate numai cele care sunt personalizate. Functia ns_get_taxonomies face același lucru, dar pentru taxonomii, desigur.


Pasul 3 Efectuarea acestuia în tema WordPress

Avem pagina de setări declarată și câteva postări personalizate și taxonomii declarate. Următorul pas este să îl facem să funcționeze în tema pe care o folosim. În scopuri de testare lucrăm cu tema Twenty Eleven WordPress, dar acest cod ar trebui să funcționeze cu orice temă.

Să modificăm clasa Walker din meniul WordPress pentru a înlocui ieșirea implicită. Citiți setările noastre și folosiți valorile pentru a adăuga un nou actual_page_item ns_current_page_item clasă în respectiva pagină când afișăm buclă personalizată pentru postare sau pagină singulară asociată.

 clasa NS_Walker_Nav_Menu prelungește Walker_Nav_Menu funcția start_el (& $ output, $ item, $ depth, $ args) global $ wp_query; $ indent = ($ adâncime)? str_repeat ("\ t", adâncime $): "; if (isset ($ args-> current_nav_element)) $ current_nav_element = $ args-> current_nav_element; $ class_names = $ value ="; $ classes = goale ($ item-> classes)? array (): (matrice) $ item-> classes; $ classes [] = 'meniu-item-'. $ Item-> ID; $ classes [] = 'pagina-gui-'. $ Item-> object_id; $ class_names = join (", apply_filters ('nav_menu_css_class', array_filter ($ classes), $ item, $ args)); $ class_names = ''; $ id = apply_filters item-> ID, $ element, $ args); $ id = strlen ($ id); '': "; $ output. = $ indent. '„; $ atribute =! gol ($ item-> attr_title)? 'title =' '. esc_attr ($ item-> attr_title)' '': '; $ atributele. =! empty ($ item-> target)? esc_attr ($ item-> target). '' ': "; atribute $. = =! gol ($ item-> xfn)? 'rel =' '. esc_attr ($ item-> xfn).' ''; '; $ attributes = = empty ($ item-> url)?' href = "'. esc_attr ($ item-> url). '' ': "; $ item_output = $ args-> înainte; $ item_output. = '„; $ item_output. = $ args-> link_before. apply_filters ('the_title', $ item-> title, $ item-> ID). $ Args-> link_after; $ item_output. = ''; $ item_output. = $ args-> după; $ output = = apply_filters ('walker_nav_menu_start_el', $ item_output, $ item, $ depth, $ args); 

Noul NS_Walker_Nav_Menu Clasa citește valorile de navigație stocate într-un tablou înainte de imprimare. În acest caz, folosiți un dacă() pentru a evalua dacă elementul de navigație curent se potrivește cu valoarea stocată anterior pentru pagina pe care WordPress o imprimă în prezent. Dacă condiția este adevărată atunci clasele "current_page_item" și "ns_current_page_item" sunt adăugate la clasele existente stocate în $ class_names variabil.

Apoi trebuie să folosim o funcție personalizată. Când îl sunăm, această funcție va imprima meniul din temă.

 funcția ns_wp_nav_menu ($ args) global $ post; $ ns_walker = nou NS_Walker_Nav_Menu (); $ args ['walker'] = $ ns_walker; $ ns_navigation_predefined_values ​​= get_option ('ns_navigation_predefined_values'); $ custom_post_type = get_post_type ($ post); $ available_post_types = (matrice) ns_get_post_types (); $ taxonomy_type = get_queried_object (); $ taxonomy_type = $ taxonomy_type-> taxonomie; $ available_taxonomy_types = (matrice) ns_get_taxonomies (); dacă is_singular ($ custom_post_type) && array_key_exists ($ custom_post_type, $ available_post_types)) $ args ['current_nav_element'] = (funcția_există ('icl_object_id'))? icl_object_id ($ ns_navigation_predefined_values ​​[$ custom_post_type], 'pagina'): $ ns_navigation_predefined_values ​​[$ custom_post_type];  elseif (is_tax ($ taxonomy_type) && array_key_exists ($ taxonomy_type, $ available_taxonomy_types)) $ args ['current_nav_element'] = (funcția_există ('icl_object_id'))? icl_object_id ($ ns_navigation_predefined_values ​​[$ taxonomy_type], 'pagina'): $ ns_navigation_predefined_values ​​[$ taxonomy_type];  altfel unset ($ args ['current_nav_element']);  wp_nav_menu ($ args); 

ns_wp_nav_menu () este creat pentru a simplifica utilizarea programului wp_nav_menu () încorporat. Primul pas este să forțezi funcția pentru a încărca noua clasă Walker folosind $ ns_walker = nou NS_Walker_Nav_Menu () și adăugarea la matricea parametrilor utilizând $ args ['walker'] = $ ns_walker;.

În loc să treci întotdeauna parametrii necesari funcției, aceasta este inclusă în mod implicit. În acest caz specific, funcția citește postarea curentă și chiar citește pagina tradusă dacă pluginul WPML este activat pe site-ul dvs. WordPress.

Mai întâi evaluează dacă pagina este în vizualizare unică folosind is_singular () și obțineți din baza de date valoarea stocată corespunzătoare. A doua opțiune posibilă de evaluat este dacă pagina curentă este o interogare cu taxonomie is_tax (). Dacă nu, atunci nu este nimic de selectat și codul eliberează elementul de navigație curent folosind unset ($ args ['current_nav_element'])


Pasul 4 Imprimarea meniului de navigare într-o temă WordPress

Deschide header.php fișier în Twenty Eleven temă, găsiți wp_nav_menu () funcția, aproximativ pe linia 118, și înlocuiți-o cu ns_wp_nav_menu păstrând aceiași parametri și nimic altceva, deoarece funcția nouă gestionează restul parametrilor necesari în mod prestabilit. Noul cod ar trebui să arate astfel:

 ", 'theme_location' => 'primar');?>

Această funcție utilizează aceleași argumente ca și standardul wp_nav_menu funcția astfel încât nu ezitați să tweak la fel de mult cum doriți sau de care aveți nevoie.

Deschis style.css prea și înlocuiți codul pe linie 617 cu:

 #acces .current_page_ancestor> a, #access .ns_current_page_item> a font-weight: bold; 

Pasul 5 Obțineți maximum de la sistemul de navigare îmbunătățit

Aveți postări personalizate, taxonomii personalizate și ați creat pagini noi cu șabloane pentru a afișa aceste bucle personalizate. Probabil ați creat un nou meniu în wp-admin și ați adăugat și acele pagini. Deschideți pagina de setări predefinite a meniurilor aflată sub Aspect și setați paginile selectate pentru fiecare post personalizat și taxonomia pe care ați creat-o.

Când afișați postul personalizat sau singura pagină legată de această postare personalizată, navigarea va evidenția elementul de meniu corespunzător.


Concluzie

Există multe modalități de a obține același rezultat, dar după câteva proiecte publicate care utilizează această abordare, am constatat că aceasta este cea mai bună și mai ușor de utilizat.

Oricum, acesta este doar începutul tuturor posibilităților pe care le puteți obține atunci când înțelegeți acest cod și începeți să efectuați modificări pentru nevoile dvs. personale.

Vă încurajez să continuați cercetarea despre clasa Walker de navigație. Există o mulțime de posibilități ascunse acolo, puteți paria pe ea.

Cod