Contacte

Inurl php propriul meniu de plată ID. Meniu pe mai multe niveluri în PHP și MySQL. # 7 Adăugați clase CSS la toate meniurile

În articolul de pe blog înainte de ultimul, am scris despre o inovație interesantă în cea mai recentă versiune de wordpress - un mecanism special pentru crearea și gestionarea . Acum a devenit mult mai convenabil și mai ușor pentru utilizatorii obișnuiți să creeze meniuri de complexitate variată, care pot consta nu numai din pagini sau categorii de blog, ci și să aibă link-uri către orice URL. Pentru a afișa meniul în șablon, se folosește o funcție specială wp_nav_menu - vă voi spune despre asta astăzi.

Dacă nu există o secțiune de meniu în adminul wordpress, atunci acesta poate fi activat prin adăugarea unui cod special în fișierul functions.php

Iată mai întâi numele meniului pe care l-am creat. Aceasta este utilizarea unei funcții în cazul general fără widget-uri, va trebui să lucrați cu ele puțin diferit acolo. Cu toate acestea, funcția wp_nav_menu poate fi afișată și fără argumente, drept urmare diferite situații vor fi „vizualizate” - mai întâi, o potrivire după numele meniului, dacă este specificat cel puțin un element de meniu pentru acesta, altfel un nu - meniul gol va fi afișat și așa mai departe. Dar din nou, vă sfătuiesc să utilizați pur și simplu codul de mai sus și să nu vă dați seama ce ar trebui să scoată funcția fără argumente. Sintaxa sa arată astfel:

Următorii parametri sunt utilizați aici:

$meniu- identificatorul selectat pentru meniu - ID, slug sau numele meniului.

$container- meniul UL implicit este „înfășurat” într-un container DIV folosind această setare.

$container_class- indică clasa containerului, implicit valoarea acestuia este menu-(menu slug)-container, adică în cazul nostru, de exemplu, va exista o clasă menu-first-container.

$container_id- puteți adăuga un ID la container, acesta nu este specificat implicit.

$menu_class este clasa pentru elementul de meniu UL, valoarea sa este meniu.

$menu_id- ID pentru elementul ul, implicit la meniu-(slug)

$ecou- dacă nu doriți să afișați meniul, dar să returnați valoarea funcției, utilizați valoarea 0 pentru această setare.

$fallback_cb- dacă meniul nu există, se apelează funcția wp_page_menu.

$inainte- setează textul care este afișat înaintea linkului A.

$link_before— afișează o frază înainte de textul linkului, nu este setată.

$link_after- afișat după textul linkului, de asemenea gol.

$adâncime- setează numărul de niveluri ierarhice pentru afișarea meniului, valoarea implicită 0 afișează întregul meniu.

$walker- un fel de „obiect walker” de utilizator de neînțeles, probabil că dezvoltatorii mai avansați vor avea nevoie de el.

$theme_location- Locația temei în care va fi folosit meniul trebuie activată prin register_nav_menu() pentru ca utilizatorul să o selecteze. De asemenea, un fel de setare nu complet clară, aparent, atunci când lucrați cu widget-uri.

Exemple de utilizare a funcției wp_nav_menu

Cel mai simplu cod dat în codex:

Eliminarea containerului DIV din meniu

"")); ?>

În principiu, nu este nimic complicat în crearea și gestionarea meniurilor wordpress 3.0. Dezvoltatorii au simplificat foarte mult procedura de lucru și au extins capacitățile acestui element de navigare. Soluția este adesea folosită în multe sarcini șablon, de exemplu, atunci când se creează pentru versiuni mobile și desktop. Puțin mai târziu, voi adăuga încă câteva fragmente pe acest subiect.

P.S. gardian. Interesant și util pentru webmasteri Blog despre SEO, unde vei găsi răspunsuri la întrebările tale despre seo.
Compania Aweb s-a impus de mult și foarte bine în domeniul promovării site-urilor web, optimizării și promovării motoarelor de căutare pe Internet.

Dacă sunteți interesat de răspunsul la întrebarea cum să creați un meniu pentru site-ul web, atunci ați ajuns la locul potrivit.

Ne vom uita la crearea unui meniu dinamic în php, scris special pentru manechini în programare, precum și pentru cei care sunt încă în rezervor.

Lecția 3

Să creăm viitorul aspect al site-ului nostru. Pentru a face acest lucru, desenați un site web super frumos în Photoshop și tăiați-l în bucăți. Să ne imaginăm că antetul, sigla, meniul și subsolul nu sunt scrise în cuvinte, ca în acest exemplu, dar acestea sunt elemente ale site-ului cu design rafinat și colorat.

De exemplu, să creăm trei pagini și să le numim Secțiunea 1, Secțiunea 2, Secțiunea 3

Acest text va fi diferit pentru diferite pagini, dar nu ne vom deranja cu el și îl vom lăsa așa cum este pe toate paginile.

Să începem să creăm un site web în php.

1. Separați antetul, sigla, meniul, blocurile de subsol în fișiere separate cu extensia php sau html

header.html

logo.html

meniu.html

footer.html

Să adăugăm un fișier cu acest text pentru a-l vedea pe toate paginile. Să-i spunem text.html

Notă. De acum înainte voi păstra înregistrări suplimentare direct în dosar text.html

2. Să creăm un șablon pentru site-ul nostru în php.

Pentru a face acest lucru, haideți să o facem simplu - salvați fișierul real, dar cu extensia php și ștergeți tot conținutul textului. Să nu fie profesional, dar este de înțeles și vom complica totul mai târziu. Acum, principalul lucru este să înțelegeți principiul aspectului.

3. Acum nu avem nevoie de fișierul template.html.

Datorită lui, avem o idee despre cum va arăta site-ul nostru.

4. Șablonul nostru este fișierul template.php

Vom insera acum toate elementele site-ului în el folosind comanda include.

5. Să creăm trei pagini, așa cum ne-am propus inițial.

Sectiunea 1, Hai sa sunăm 1.php

Sectiunea 2, Hai sa sunăm 2.php

Secțiunea 3, Hai sa sunăm 3.php

Pentru a face acest lucru, puteți folosi cea mai simplă comandă Salvează ca...

Pentru cei mai mici voi explica: deschideți fișierul template.php, apoi apăsați Salvează ca...și salvați sub nume 1.php, repetați procedura și salvați secvențial paginile site-ului 2.php, 3.php

Avem 3 pagini cu același design. Este suficient să inserați în loc de fișier text.html alta, pentru a completa cu imagini diferite sau orice coduri html, scripturi și conținutul fiecărei pagini va fi unic.

Atenţie!

Dacă fișierul nu este creat index.php pentru pagina principală, apoi în browser, tastând adresa site-ului, nu vom vedea site-ul în sine, ci doar structura directoarelor (lista de foldere).

Poți să te uiți în Denver și să vezi singur. Să remediam situația - creați un fișier index.phpși sună mult timp fără alte prelungiri Acasă. Să creăm un fișier text-home.html iar cu comanda include Lipiți pe pagina principală nou creată a site-ului.

6. Cum să vizualizați un site în php?

Ce sa întâmplat - deci pur și simplu nu văd. Acesta nu mai este un șablon cu extensie html.

Dar nici o problemă. Avem nevoie de al nostru, adică. server local de pe computer. Pentru a face acest lucru, vom instala Denver și ne vom uita la rezultatul muncii noastre în browser fără a intra online.

Acum iată comanda. Am introdus adresa site-ului și am văzut tot ce tocmai fusese creat într-o formă normală cu un design.

Acum să luăm meniul site-ului php.

1. Deschideți fișierul menu.html și transformați secțiunile 1, 2 și 3 în link-uri de site. Link-urile în php sunt create în moduri diferite.

Sarcina noastră este să învățăm cum să simțim site-ul creat în php. Prin urmare, vom face linkuri, ca pe un site static obișnuit Secțiunea 1 etc.

Îmi place foarte mult această procedură de creare a linkurilor în Macromedia Dreamweaver. Aveți timp să culegeți Bineși bea cafea.

2. Cum să faci un link în meniu inactiv dacă vizitatorul se află pe această pagină.

Va fi mai convenabil pentru vizitator să navigheze pe site știind pe ce pagină se află.

Dacă ai parcurs toți pașii strict punct cu punct, atunci poți vedea că toate linkurile din meniu sunt active în mod constant la noi. Cum să o repar?

În primul rând, să ne amintim definiția a ceea ce este Declarații condiționale

- acesta este momentul în care se realizează sau nu o acțiune în funcție de condiții.

Să facem următoarele:

  • Noi vom avea nevoie variabileși unul operator condițional:

dacă ($master == "Maestru")// această condiție. Dacă este executat, atunci în acest loc al meniului, folosind comanda echo, sunt inserate etichete HTML obișnuite care afișează inscripția „Acasă”.

ecou"

Acasă

";

altfel//înseamnă „altfel” - ce se întâmplă dacă condiția nu este îndeplinită. În acest caz, dacă condiția nu este îndeplinită, inscripția „Principal” va fi un link care duce la pagina principală.

ecou"

Acasă

";

  • Am venit cu o condiție, dar pentru a face asta verifica variabilatrebuie să-l întrebi.

Pentru a face acest lucru, plasați următoarele blocuri de cod pe toate paginile:

$master = "Maestru";

$master ="Secțiunea 1";

$master ="Secțiunea 2";

$master ="Secțiunea 3";

După cum puteți vedea, fiecare pagină are propriul cod.

Deci, pașii noștri practici pentru crearea unui meniu php vor fi următorii:

1) Deschiderea fișierului index.php

și lipiți codul

$master = "Maestru";

până la punctul de inserare a codului care afișează meniul site-ului propriu-zis includeți „menu.html”;
?>

2) Deschiderea fișierului meniu.htmlși introduceți codul cu condiția în loc de un simplu link html către pagina principală.

Ne uităm în browser și admirăm! Dacă mergem la pagina principală, linkul nu mai este activ!

3) Repetați pașii 1 și 2 cu paginile 1.php, 2.php, 3.php

Repetiția 1:

1) Deschideți fișierul 1.php și lipiți înaintea codului care afișează meniul un bloc cu o variabilă dată

$master ="Secțiunea 1";

2) Deschideți fișierul menu.html și lipiți codul cu condiția în loc de un simplu link Sectiunea 1 prin efectuarea următoarelor modificări:

dacă ($master == „Secțiunea 1”)// această condiție. Dacă se execută, atunci în acest loc al meniului, folosind comanda echo, sunt inserate etichete HTML obișnuite care afișează inscripția „Secțiunea 1”.

ecou"

Sectiunea 1

";

altfel//înseamnă „altfel” - ce se întâmplă dacă condiția nu este îndeplinită. În acest caz, dacă condiția nu este îndeplinită, inscripția „Secțiunea 1” va fi un link care duce la pagina principală.

ecou"

Sectiunea 1

";

Minunea s-a întâmplat din nou! Acum dacă suntem pe pagină Sectiunea 1, linkul din meniu nu este activ.

Repetiția este mama învățării! Sau pentru cei din rezervor! Din nou

repetare 2

1) Deschide fișierul 2.phpși lipiți codul.

$master ="Secțiunea 2";

2) Deschideți din nou fișierul menu.html și inserați codul cu condiția

dacă ($master == „Secțiunea 2”)// această condiție. Dacă se execută, atunci în acest loc al meniului, folosind comanda echo, sunt inserate etichete HTML obișnuite care afișează inscripția „Secțiunea 2”.

ecou"

Sectiunea 2

";

altfel//înseamnă „altfel” - ce se întâmplă dacă condiția nu este îndeplinită. În acest caz, dacă condiția nu este îndeplinită, inscripția „Secțiunea 2” va fi un link care duce la pagina principală.

ecou"

Sectiunea 2

";

Repetiția 3

1) Deschidem fișierul 3.phpși setați variabila.

$master ="Secțiunea 3";

2) În fișierul menu.html, introduceți codul cu condiția în loc de link Secțiunea 3, modificările sunt:

dacă ($master == „Secțiunea 3”)// această condiție. Dacă se execută, atunci în acest loc al meniului, folosind comanda echo, sunt inserate etichete HTML obișnuite care afișează inscripția „Secțiunea 3”.

ecou"

Secțiunea 3

";

altfel//înseamnă „altfel” - ce se întâmplă dacă condiția nu este îndeplinită. În acest caz, dacă condiția nu este îndeplinită, inscripția „Secțiunea 3” va fi un link care duce la pagina principală.

ecou"

Secțiunea 3

";

Rezultat: noi în loc de link-uri în meniul de acest fel

Acasă


Sectiunea 1

Sectiunea 2


Secțiunea 3

Acest tutorial php a fost scris la cererea populară din partea vizitatorilor site-ului și este un ghid practic pentru a învăța cum să creați un meniu dinamic pentru un site php.

Următoarea fișă pentru webmasteri vă va spune cum să creați titluri, descrieri și cuvinte cheie unice pentru fiecare pagină în php.

Puteți descărca arhiva cu toate șabloanele de site și fișierele de meniu php. Recomandat incepatorilor in programare.

Dacă sunteți pregătit pentru un studiu serios al php, atunci este dificil să găsiți un curs video mai bun de la Popov. Are multă experiență și un stil bun.

]]> ]]>

Pentru că expune conținutul modulului menu.php. Mai jos este propriul meu meniu de dezvoltare în PHP, care a fost scris de la zero într-un notepad.

Acest cod va fi util în special pentru site-urile dinamice care au motoare auto-scrise. Voi oferi două versiuni ale codului care au diferențe minore (care diferență va fi explicată mai târziu).

Pentru început, voi oferi o structură aproximativă a site-ului pentru care este potrivit acest meniu. Structura site-ului ar trebui să arate astfel (vizualizare clasică):

/index.html /section_1/ /razdel_1/articles_1.html /razdel_1/articles_2.html ... /razdel_2/ /razdel_2/articles_1.html /razdel_2/articles_2.html ... ... ... /razdel_N/articles_2 .html

Site-ul poate conține și subsecțiuni pentru secțiuni:

/section_1/podzaderl_1/ /section_1/podzaderl_1/articles_1.html /section_1/podzaderl_1/articles_2.html ... /section_1/podzaderl_2/articles_1.html /section_1/podzaderl_2/articles_2.html

Această structură va funcționa și pentru meniul nostru, cu doar diferențe minore.

Vă sugerez să creați un fișier separat pentru meniul în php. De exemplu, menu.php ar fi un nume grozav pentru un astfel de fișier. Pentru a implementa meniul, este introdus și stilul meniului CSS pentru a-l face mai mult sau mai puțin frumos imediat. Desigur, acest stil este dat doar pentru referință, deoarece design-urile site-urilor sunt foarte diferite.

Cod stil de meniu CSS:

.meniu (înălțime:42px; umplutură:0 0 0 16px; fundal:url(images/spacer.png) repetare; ) .meniu li ( display:block; float:left; ) .meniu li.active ( fundal: #000011 ; ) .meniu a (color:#FFF; display:block; line-height:42px; text-decoration:none; padding:0 14px; ) .menu a:hover ( background:url(images/spacer.png) repetare ;)

Acum, să aruncăm o privire la implementarea primului meniu în PHP, care este puțin o simplificare.

Prima versiune a codului de meniu în PHP

\n"; pentru ($i=0;$i ": "
  • "; ecou" ".$array_menu[$i]["nume"]."
  • \n"; ) echo ""; ?>

    Meniul poate fi împărțit în două părți. Prima conține o matrice de informații $array_menu , care conține numele secțiunilor noastre cu link-uri către secțiuni. Există o opțiune de a pune aceste date în baza de date mySQL, dar nu are mare rost în asta, deoarece eșantionul este foarte mic, astfel încât acest lucru nu va afecta viteza de lucru.

    A doua parte conține ieșirea meniului prin bucla for. Bucla compară adresa site-ului web cu adresa din matricea $array_menu. Dacă există o potrivire, atunci vom afișa următoarea secțiune a meniului cu o clasă specială activă:

  • , altfel doar
  • . Acest lucru ne permite să evidențiem cu o anumită culoare acea parte a meniului în care se află utilizatorul. În opinia mea, acesta este un lucru necesar oricărui site pentru ca utilizatorul să înțeleagă în ce secțiune se află.

    Ordinea în matrice va fi păstrată la afișarea meniului pe site. Adică, matricea trebuie să fie completată în ordinea în care doriți să afișați meniul.

    Notă:
    În cazul în care adresele URL (adresele) ale titlului secțiunilor arată astfel:
    /sectiunea 1
    sau așa
    /section_1/name_razdela.html
    apoi în array_menu trebuie să scrieți potrivirea exactă:
    $array_menu[$i]["url"]="/section_1"
    sau pentru al doilea caz:
    $array_menu[$i]["url"]="/section_1/nazvanie_razdela.html";

    Cum funcționează prima opțiune de meniu?
    Evidențiază meniul doar dacă vă aflați la adresa titlului secțiunii. De exemplu, dacă adresa paginii este /section_1/articles_1.html , atunci meniul nu va fi evidențiat în niciun fel.

    A doua versiune a codului este o versiune modificată a primei și prevede posibilitatea evidențierii meniului chiar și în articolele care sunt în secțiuni.

    A doua versiune a codului de meniu în PHP

    "; pentru ($i=0;$i ": "
  • "; echo "".$array_menu[$i]["titlu"]."
  • "; ) else ( echo ($URL) == ($array_menu[$i]["url"])? "
  • ": "
  • "; echo "".$array_menu[$i]["titlu"]."
  • "; ) ) ecou ""; ?>

    Afișează un meniu personalizat creat în panou: Aspect > Meniuri.

    Ce meniu de navigare să fie afișat (pot fi mai multe) este specificat în parametrul theme_location.

    Dacă parametrul theme_location nu este specificat, atunci meniul pentru afișare va fi selectat în următoarea ordine:

      Un meniu care se potrivește cu ID-ul, slug-ul sau descrierea trecută în parametrul „meniu” și dacă există cel puțin o legătură (un element) în acest meniu;

      în caz contrar, primul meniu nu este gol;

      sau, afișează valoarea returnată de funcția specificată în parametrul „fallback_cb” (în mod implicit, funcția wp_page_menu este specificată acolo);

    1. dacă nimic nu se potrivește, funcția nu va scoate nimic.

    Pentru ca tema să accepte meniuri, trebuie să activați această funcție cu:
    add_theme_support ("meniuri");

    Sau puteți înregistra un loc pentru meniu, cu register_nav_menu() , apoi suportul pentru meniul temei va fi activat automat.

    Elemente de meniu modificarea filtrelor

    • add_filter("wp_nav_menu_args", "my_wp_nav_menu_args"); funcția my_wp_nav_menu_args($args = "")( $args["container"] = false; returnează $args; )

      #4.1. Să scoatem containerul, doar unul, meniul afișat

      "" ]); ?>

      # 5 Îndepărtați ambalajul ul

      Acest exemplu va elimina ul wrapper-ul din meniu:

      „%3$s” ]); ?>

      # 6 Adăugați un cuvânt în partea de sus a meniului

      Acest exemplu arată cum să adăugați un cuvânt în partea de sus a unei liste de meniu, ca același element de meniu, dar nu ca link. Să adăugăm cuvântul „List” la începutul meniului și, de asemenea, să specificăm atributul id pentru eticheta li creată:

      "primar", "items_wrap" => "

      • Listă:
      • %3$s
      " ]); ?>

      # 7 Adăugați clase CSS la toate meniurile

      Folosind un cârlig, putem adăuga propriile noastre clase CSS dacă este îndeplinită condiția de care avem nevoie.

      Să adăugăm o clasă CSS dacă este o postare și numele elementului de meniu este „blog”:

      Add_filter("nav_menu_css_class", "special_nav_class", 10, 2); function special_nav_class($clase, $articol)( if(is_single() && $item->title == "Blog)"){ $classes = "special-class"; } return $classes; } !}

      #8 Utilizarea funcției dvs. pentru a construi un meniu

      Mai întâi, trebuie să specificați argumentul „walker” => new Your_Walker_Function .

      Your_Walker_Function este noua noastră clasă care creează meniul. Pentru a nu reinventa roata, aceasta poate fi copiată din original, vezi clasa Walker_Nav_Menu . Copiem codul clasei și doar îl reparăm acolo unde este necesar.

      Iată un exemplu care adaugă adâncimea meniului și clase CSS par/impare la elementele de meniu (atât ul, cât și li):

      // clasă de creare a meniului personalizat: clasa magomra_walker_nav_menu extinde Walker_Nav_Menu ( // adaugă clase la funcția submeniului ul start_lvl(&$output, $depth) ( // clase dependente de adâncime $indent = ($depth > 0 ? str_repeat("\ t", $depth): ""); // cod indent $display_depth = ($depth + 1); // pentru că numără primul submeniu ca 0 $classes = array ("sub-meniu", ($display_depth % 2 ? "meniu-impar": "meniu-par"), ($display_depth >=2 ? "sub-sub-meniu": ""), "menu-depth-" . $display_depth); $class_names = implode( " ", $classes); // construiți html $output .= "\n" . $indent . "

        " . "\n"; ) // adaugă clasele principale/subclaselor la funcția li"-urilor și a legăturilor start_el(&$output, $item, $depth, $args) ( global $wp_query; $indent = ($depth > 0) ? str_repeat("\t", $depth): ""); // cod indent // clase dependente de adâncime $depth_classes = array(($depth == 0 ? "main-menu-item": "sub-meniu- element"), ($adâncime >=2 ? "sub-sub-element-meniu" : ""), ($depth % 2 ? "menu-item-odd" : "meniu-articol-par"), "meniu -item-depth-" . $depth); $depth_class_names = esc_attr(implode(" ", $depth_classes)); // au trecut clase $classes = empty($item->classes) ? array() : (array) $ item->classes; $class_names = esc_attr(implode(" ", apply_filters("nav_menu_css_class", array_filter($classes), $item))); // build html $output .= $indent . "
      • ) returnează $articole; ) funcția __nav_hasSub($item_id, $items)( foreach($items as $item)( if($item->menu_item_parent && $item->menu_item_parent == $item_id) returnează adevărat; ) returnează false; )

        # 11 Adăugarea unei clase la elementele individuale de meniu

        Din versiunea 4.1.

        Există un cârlig special pentru aceasta: nav_menu_css_class . Și acum clasele pot fi adăugate sau eliminate prin intermediul acestuia. De exemplu, să adăugăm clasa my__class la toate elementele de meniu:

        Add_filter("nav_menu_css_class", "add_my_class_to_nav_menu", 10, 2); funcția add_my_class_to_nav_menu($classes, $item)( /* $classes conține Array( => meniu-item => meniu-item-type-post_type => meniu-item-obiect-pagina => meniu-articol-284) */ $clase = "clasa_mea"; returnează $clase; )

        Până la versiunea 4.1.

        Clasele pentru elementele de meniu sunt adăugate de funcția _wp_menu_item_classes_by_context(&$menu_items); . Dar, din păcate, nu oferă niciun filtre pentru a vă adăuga clasa. Prin urmare, haideți să folosim cârja str_replace() :

        // obtinerea in loc de afisarea meniului $menu = wp_nav_menu(array("echo" => 0,)); // adaugă clasa my__class la toate articolele $menu = str_replace("class="menu-item", "class="menu-item my__class", $meniu); // afișează echo $meniul;

        #12 Afișați meniul numai dacă acesta există

        În mod implicit, dacă nu există niciun meniu, atunci vor fi afișate paginile site-ului. Dar dacă doriți să afișați meniul numai atunci când este creat în panoul de administrare, specificați parametrul fallback_cb ca „__return_empty_string”:

        wp_nav_menu(array("theme_location" => "meniu-principal", "fallback_cb" => "__return_empty_string");

        #13 Se afișează numai sub-articolul din meniu

        Să presupunem că există un prim nivel și fiecare dintre elementele primului nivel are propriul său submeniu. Trebuie să afișăm un astfel de submeniu pentru un articol cu ​​clasa meniu-articol-135:

        ## Decupați toate LI-urile submeniului dorit și afișați-le în blocul nostru UL $menu = wp_nav_menu(array("theme_location" => "header_menu", "container" => "", "echo" => 0,) ); $regex_part = preg_quote("articol-meniu-135"); // afișează submeniul articolului "gotovye-resheniya" preg_match ("~". $regex_part .".*sub-meniu[^>]+>(.*?)

      ~s", $meniu, $mm); if(!empty($mm)) echo "";

      Nu foarte optim, dar un exemplu de lucru. Uneori poate fi util pentru site-urile puțin vizitate, unde trebuie să obțineți rapid rezultate.

      Clasele CSS pentru elementele de meniu

      Următoarele clase CSS sunt adăugate elementelor de meniu (separate de condițiile în care paginile se află utilizatorul):

      Pentru toate elementele de pe toate paginile

        .articol din meniu- la toate articolele din meniu;

        .menu-element-obiect-(obiect)- la toate elementele, unde (obiectul) este înlocuit cu numele tipului de post sau taxonomiei:
        .menu-element-obiect-categorie (pentru categorii)
        .menu-item-object-tag (pentru etichete)
        .menu-item-object-page (pentru pagini persistente)
        .menu-element-obiect-(personalizat)

      • .menu-element-tip-(tip)- la toate elementele de meniu, unde (tip) este înlocuit cu tipul de link (post sau taxonomie). Grupează toate tipurile de linkuri:
        .menu-item-type-post_type (pagină permanentă, tip de postare personalizat)
        .menu-item-type-taxonomie (categorie, etichetă sau taxonomie personalizată)

      Pentru elementele paginii curente

      • .articol-curent din meniu- dacă linkul din meniu se potrivește cu adresa paginii vizualizate. Pagina curenta.

      Pentru elementele părinte ale paginii care este vizualizată

      • .curent-meniu-părinte
      • .curent-(obiect)-strămoș
      • .curent-(tip)-strămoș

      Pentru elemente legate cumva de pagina care este vizualizată

      • .curent-meniu-strămoș
      • .curent-(obiect)-strămoș
      • .curent-(tip)-strămoș

      Pentru elemente legate de pagina principală a site-ului

      • .meniu-articol-acasă

      Compatibilitate cu funcția wp_page_menu().

      • .page_item
      • .pagina-articol-$ID
      • .current_page_item
      • .current_page_parent
      • .current_page_ancestor

      $item obiect

      parametrii $item

      Exemplele folosesc adesea elementul de meniu $item. Aproape toți parametrii acestui element sunt prezentați mai jos:

      Camp Descriere
      ID ID element de meniu
      menu_item_parent ID-ul elementului de meniu părinte
      clase matrice de clase de elemente de meniu
      data_post Data adaugata
      post_modified data ultimei modificări
      post_autor ID-ul utilizatorului care a adăugat acest element de meniu
      titlu titlul elementului de meniu
      url link-ul articolului de meniu
      attr_title atributul de titlu al link-ului
      xfn atributul rel link
      ţintă atributul target al link-ului
      actual este 1 dacă acesta este elementul curent
      actual_item_ancestor 1 dacă elementul curent este un element imbricat
      părinte_articol_actual 1 dacă elementul curent este elementul părinte
      meniu_ordine numărul de serie din meniu
      obiect_id ID obiect de meniu. Înregistrări, termeni etc.
      tip tip de obiect din meniu (taxă, înregistrare)
      obiect nume fiscal, tip post: pagină, categorie, etichetă_post...
      tip_etichetă nume de tip localizat: Categorie, Pagina
      post_parent ID de părinte
      post_title titlul postului
      nume_post casa de discuri
      exemplu $item
      WP_Post Object ( => 10 => 5 => 2019-02-11 13:33:39 => 2019-02-11 13:33:39 => => Nou => => publica => închis => închis = > => nou => => => 2019-02-11 23:10:19 => 2019-02-11 23:10:19 => => 0 => http://dh5.com/?p= 10 => 1 => nav_menu_item => => 0 => brut => 10 => 0 => 10 => personalizat => personalizat => Legătură personalizată => Nou => # => => => => Array = > extra-sub-meniu => meniu-element => meniu-item-tip-personalizat => meniu-articol-obiect-personalizat => => => =>)

      Un exemplu de utilizare a parametrului walker

      În Walker, puteți specifica un obiect care va construi un meniu. În acest obiect, puteți descrie codul HTML al meniului rezultat.

      Dacă trebuie să creați un meniu pentru un aspect non-standard, atunci uneori este mai ușor să refaceți acest obiect decât să refaceți aspectul.

      Ca exemplu de obiect walker, să luăm clasa Walker_Nav_Menu() , care este folosită implicit. În ea, ne interesează doar o singură metodă start_el() . El este responsabil pentru HTML-ul fiecărui element. De regulă, este suficient să o schimbi doar pe ea. Pentru a face acest lucru, trebuie să vă creați propria clasă care va extinde clasa Walker_Nav_Menu și să o specificați în parametrul walker atunci când apelați meniul.

      Să ne uităm la un exemplu. Codul metodei start_el() a fost preluat fără modificări. Folosim ca șablon:

      Clasa My_Walker_Nav_Menu extinde Walker_Nav_Menu ( /** * Pornește ieșirea elementului. * * @de la 3.0.0 * @de la 4.4.0 Filtrul (@vede „nav_menu_item_args”) a fost adăugat. * * @see Walker::start_el() * * @param șir $ieșire Transmis prin referință. Folosit pentru a adăuga conținut suplimentar.* @param WP_Post $item Obiect de date al articolului de meniu.* @param int $depth Adâncimea elementului de meniu. Folosit pentru umplutură.* @param stdClass $args Un obiect de argumente wp_nav_menu(). * @param int $id ID curent al articolului. */ public function start_el(&$output, $item, $depth = 0, $args = array(), $id = 0) ( if (isset) ($args->item_spacing) && "renunțare" === $args->item_spacing) ( $t = ""; $n = ""; ) else ( $t = "\t"; $n = "\n "; ) $indent = ($adâncime) ? str_repeat($t, $adâncime) : ""; $clase = gol($articol->clase) ? matrice () : (matrice) $articol->clase; $clase = "articol-meniu-" .$articol->ID; $args = apply_filters("nav_menu_item_args", $args, $item, $depth); $class_names = join(" ", apply_filters("nav_menu_css_class", array_filter($) clase), $item, $args, $depth)); $class_names = $class_names ? " class="" .esc_attr($class_names) . """ : ""; $id = apply_filters("nav_menu_item_id", "menu-item-". $item->ID, $item, $args, $depth); $id = $id ? " id="" . esc_attr($id) . """ : ""; // creăm codul HTML pentru elementul de meniu $output .= $indent . " "; $atts = matrice(); $atts["titlu"] = ! gol($articol->titr_attr) ? $articol->titlu_attr: ""; $atts["țintă"] = ! gol ($articol- >țintă) ? $item->țintă: ""; $atts["rel"] = ! gol($item->xfn) ? $item->xfn: ""; $atts["href"] = ! gol ($item->url) ?$item->url: ""; $atts = apply_filters("nav_menu_link_attributes", $atts, $item, $args, $depth); $attributes = ""; foreach ($atts ca $attr => $valoare) ( ​​dacă (! empty($valoare)) ( $valoare = ("href" === $attr) ? esc_url($valoare) : esc_attr($valoare); $atribute .= " " .$attr ."="" .$value . """; ) ) $title = apply_filters("the_title", $item->title, $item->ID); $title = apply_filters("nav_menu_item_title" , $ titlu, $item, $args, $depth); $item_output = $args->before; $item_output .= " "; $item_output .= $args->link_before . $title . $args->link_after; $item_output .= ""; $item_output .= $args->after; $output .= apply_filters("walker_nav_menu_start_el", $item_output, $item, $depth, $args); ) )

      Acum, când apelăm meniul, specificăm mersul nostru:

      Wp_nav_menu(array("theme_location" => "head_menu", "walker" => new My_Walker_Nav_Menu(),));

      Gata, acum fiecare element de meniu va fi construit conform schemei HTML de care avem nevoie.

      Meniu BEM cu filtre

      Aspectul va fi format conform metodologiei BEM:

      Fişier index.php sau altul pentru a afișa meniul

      "header-meniu", ]);

      Fişier funcții.php

      „Zona de sus”, „footer-menu” => „Zona de jos”, ]); )); // Schimbă opțiunile meniului principal add_filter("wp_nav_menu_args", "filter_wp_menu_args"); funcția filter_wp_menu_args($args) ( dacă ($args["theme_location"] === "header-meniu") ( $args["container"] = false; $args["items_wrap"] = ""; $args[ "menu_class"] = "meniu meniu--meniu principal-orizontal"; ) return $args; ) // Schimbați atributul id al etichetei li add_filter("nav_menu_item_id", "filter_menu_item_css_id", 10, 4); function filter_menu_item_css_id($menu_id, $item, $args, $depth) ( return $args->theme_location === "header-menu" ? "" : $menu_id; ) // Schimbați atributul clasei etichetei li add_filter( „nav_menu_css_class”, „filter_nav_menu_css_classes”, 10, 4); function filter_nav_menu_css_classes($clase, $item, $args, $depth) ( if ($args->theme_location === "header-meniu") ( $classes = [ "menu-node", "menu-node--main_lvl_ " . ($depth + 1) ]; if ($item->current) ( $classes = "menu-node--active"; ) ) return $classes; ) // Schimbați clasa imbricatului ul add_filter(" nav_menu_submenu_css_class" , "filter_nav_menu_submenu_css_class", 10, 3); function filter_nav_menu_submenu_css_class($clase, $args, $depth) ( if ($args->theme_location === "header-meniu") ( $clase = [ "meniu", "meniu--menu derulant", "meniu--vertical " ]; ) return $classes; ) // Adăugați clase la linkuri add_filter("nav_menu_link_attributes", "filter_nav_menu_link_attributes", 10, 4); funcția filter_nav_menu_link_attributes($atts, $item, $args, $depth) ( dacă ($args->theme_location === "header-meniu") ( $atts["class"] = "menu-link"; dacă ($ item->current) ( $atts["class"] .= "menu-link--activ"; ) ) returnează $atts; )

      Comanda like-uri foarte ieftine pentru o pagina publica de Facebook pe acest serviciu si ai ocazia sa alegi nu doar un pret frumos, ci si conditii personale pentru achizitionarea unei resurse. Deci, de exemplu, veți putea alege modul rapid de primire și calitatea paginilor semnate. În plus, serviciul oferă garanții clienților săi.

      Cod meniu wp nav: wp-includes/nav-menu-template.php WP 5.2.2

      "", "container" => "div", "container_class" => "", "container_id" => "", "menu_class" => "meniu", "menu_id" => "", "echo" => adevărat, "fallback_cb" => "wp_page_menu", "before" => "", "after" => "", "link_before" => "", "link_after" => "", "items_wrap" => "" , "item_spacing" => "preserve", "depth" => 0, "walker" => "", "theme_location" => "",); $args = wp_parse_args($args, $defaults); if (! in_array($args["item_spacing"], array("preserve", "discard"), true)) ( // valoare nevalidă, reveniți la implicit. $args["item_spacing"] = $defaults[" item_spacing"]; ) /** * Filtrează argumentele utilizate pentru afișarea unui meniu de navigare. * * @din 3.0.0 * * @see wp_nav_menu() * * @param array $args Matrice de argumente wp_nav_menu(). */ $args = apply_filters("wp_nav_menu_args", $args); $args = (obiect) $args; /** * Filtrează dacă să scurtcircuitați ieșirea wp_nav_menu(). * * Returnarea unei valori non-nule la filtru va scurtcircuita * wp_nav_menu(), ecou acea valoare dacă $args->echo este adevărat, * returnând acea valoare în caz contrar. * * @din 3.9.0 * * @see wp_nav_menu() * * @param string|null $output Ieșirea meniului Nav pentru a scurtcircuita cu. implicit nul. * @param stdClass $args Un obiect care conține argumente wp_nav_menu(). */ $nav_menu = apply_filters("pre_wp_nav_menu", null, $args); if (null !== $nav_menu) ( if ($args->echo) ( echo $nav_menu; return; ) return $nav_menu; ) // Obține meniul de navigare pe baza meniului solicitat $menu = wp_get_nav_menu_object($args- >meniu); // Obține meniul de navigare pe baza locației_temei dacă (! $menu && $args->locație_temă && ($locations = get_nav_menu_locations()) && isset($locations[ $args->theme_location ])) ( $menu = wp_get_nav_menu_object( $locations[ $args->theme_location ]); ) // obținem primul meniu care are elemente dacă tot nu putem găsi un meniu dacă (! $meniu && ! $args->theme_location) ( $meniu = wp_get_nav_menus() ; foreach ($meniu ca $menu_poate) ( if ($menu_items = wp_get_nav_menu_items($menu_poate->term_id, array("update_post_term_cache" => false))) ( $meniu = $menu_poate; break; ) )() ) $args->meniu)) ( $args->meniu = $meniu; ) // Dacă meniul există, obțineți articolele sale.if ($meniu && ! is_wp_error($meniu) && ! isset($menu_items)) ( $ menu_items = wp_get_nav_menu_items($menu->term_id, array("update_post_term_cache" => false)); ) /* * Dacă nu a fost găsit niciun meniu: * - Fall back (dacă a fost specificat unul), sau cauțiune. * * Dacă nu a fost găsit niciun meniu au fost găsite elemente: * - Reveniți, dar numai dacă nu a fost specificată nicio locație a temei. * - În caz contrar, cauțiune. */ if ((! $meniu || is_wp_error($meniu) || (isset($menu_items) && empty($menu_items) && ! $args->theme_location)) && isset($args->fallback_cb) && $args ->fallback_cb && is_callable($args->fallback_cb)) ( returnează call_user_func($args->fallback_cb, (matrice) $args); ) if (! $meniu || is_wp_error($meniu)) ( returnează false; ) $ nav_menu = $items = ""; $show_container = fals; if ($args->container) ( /** * Filtrează lista de etichete HTML care sunt valabile pentru a fi utilizate ca containere de meniu. * * @de la 3.0.0 * * @param array $tags Etichetele HTML acceptabile pentru a fi utilizate ca meniu containere.* Implicit este o matrice care conține „div” și „nav”.*/ $allowed_tags = apply_filters(„wp_nav_menu_container_allowedtags”, array(„div”, „nav”)); if (is_string($args->container) && in_array ($args->container, $allowed_tags)) ( $show_container = true; $class = $args->container_class ? " class="" . esc_attr($args->container_class) . """ : " class="meniu -" . $menu->slug . "-container""; $id = $args->container_id ? " id="" . esc_attr($args->container_id) . """ : ""; $nav_menu .= "<" . $args->recipient. $id . $class. „>”; ) ) // Configurați variabilele $menu_item _wp_menu_item_classes_by_context($menu_items); $articole_meniu_sortate = $articole_meniu_cu_copii = matrice(); foreach ((matrice) $menu_items ca $menu_item) ( $sorted_menu_items[ $menu_item->menu_order ] = $menu_item; if ($menu_item->menu_item_parent) ( $menu_items_with_children[ $menu_item->menu_item;_> _menu_item) = true_item; Adăugați clasa meniu-articol-are-copii acolo unde este cazul if ($menu_items_with_children) ( foreach ($sorted_menu_items ca &$menu_item) ( if (isset($menu_items_with_children[ $menu_item->ID ])) ( $menu_item->ID ])) "menu-element-are-children"; ) ) ) unset($menu_items, $menu_item); /** * Filtrează lista sortată de obiecte de meniu înainte de a genera codul HTML al meniului. * * @since 3.1.0 * * @param array $sorted_menu_items Elementele de meniu, sortate după ordinea meniului fiecărui element de meniu. * @param stdClass $args Un obiect care conține argumente wp_nav_menu(). */ $sorted_menu_items = apply_filters("wp_nav_menu_objects", $sorted_menu_items, $args); $items .= walk_nav_menu_tree($sorted_menu_items, $args->depth, $args); unset($articole_menu_sortate); // Atribute if (! empty($args->menu_id)) ( $wrap_id = $args->menu_id; ) else ( $wrap_id = "meniu-" . $menu->slug; while (in_array($wrap_id, $ menu_id_slugs)) ( dacă (preg_match("#-(\d+)$#", $wrap_id, $match)) ( $wrap_id = preg_replace ("#-(\d+)$#", "-" . ++$ potriviri, $wrap_id); ) else ( $wrap_id = $wrap_id . "-1"; ) ) ) $menu_id_slugs = $wrap_id; $wrap_class = $args->menu_class ? $args->menu_class: ""; /** * Filtrează conținutul listei HTML pentru meniurile de navigare. * * @since 3.0.0 * * @see wp_nav_menu() * * @param string $items Conținutul listei HTML pentru elementele de meniu. * @param stdClass $args Un obiect care conține argumente wp_nav_menu(). */ $items = apply_filters("wp_nav_menu_items", $items, $args); /** * Filtrează conținutul listei HTML pentru un anumit meniu de navigare. * * @since 3.0.0 * * @see wp_nav_menu() * * @param string $items Conținutul listei HTML pentru elementele de meniu. * @param stdClass $args Un obiect care conține argumente wp_nav_menu(). */ $items = apply_filters("wp_nav_menu_($meniu->slug)_items", $items, $args); // Nu tipăriți niciun marcaj dacă nu există elemente în acest moment. if (empty($items)) ( return false; ) $nav_menu .= sprintf($args->items_wrap, esc_attr($wrap_id), esc_attr( $wrap_class), $items); unset($items); if ($show_container) ( $nav_menu .= "recipient. „>”; ) /** * Filtrează conținutul HTML pentru meniurile de navigare. * * @since 3.0.0 * * @see wp_nav_menu() * * @param string $nav_menu Conținutul HTML pentru meniul de navigare. * @param stdClass $args Un obiect care conține argumente wp_nav_menu(). */ $nav_menu = apply_filters("wp_nav_menu", $nav_menu, $args); if ($args->echo) ( echo $nav_menu; ) else ( return $nav_menu; ) )

    Niciun site nu este complet fără navigare, sau așa cum este numit și „meniul site-ului”. Deci, meniul site-ului poate fi pe un singur nivel și pe mai multe niveluri sub formă de arbore. Dacă nu există dificultăți deosebite în ceea ce privește implementarea cu un meniu cu un singur nivel, atunci când creați un meniu cu mai multe niveluri, trebuie să vă gândiți cu atenție.

    Cel mai important lucru în această sarcină este să proiectăm o bază de date pentru meniul nostru cu mai multe niveluri. Să creăm un tabel Categorii cu trei câmpuri id, titlu, mamă Unde:

    • ID- identificator
    • Titlu- Numele meniului
    • mamă- Categoria implicită părinte 0

    Câmpul este responsabil pentru ramificarea meniului mamă Dacă părinte = 0, atunci această categorie este categoria părinte. Pentru a adăuga copii la categoria părinte, trebuie să specificați în câmpul părinte ID părintele dorit. De exemplu:

    Tabele cu categorii

    După cum se vede din tabel, categoria părinte Mașini sunt doi descendenți MazdaȘi Hondaînrudite pe domenii mamă. Și categoria Motociclete doi descendenți sunt kawasakiȘi harley. În același timp, categoria Bărci nu are descendenți. Sper că înțelegeți cum să legați categoriile.

    În continuare, trecem de la cuvinte la practică. Să creăm tabelul Categorii.

    CREATE TABLE IF NU EXIST `categories` (`id` int(10) unsigned NOT NULL AUTO_INCREMENT, `title` varchar(255) NOT NULL, `parent` int(10) unsigned NOT NULL, PRIMARY KEY (`id`)) ENGINE=MyISAM DEFAULT CHARSET=utf8 AUTO_INCREMENT=20 ; -- -- Dump `categories` data table -- INSERT INTO `categories` (`id`, `title`, `parent`) VALORI (1, "Mașini", 0), (2, "Motociclete", 0) , (3, Mazda, 1), (4, Honda, 1), (5, Kawasaki, 2), (6, Harley, 2), (7, Mazda 3, 3 ), (8, "Mazda 6", 3), (9, „Sedan”, 7), (10, „Hatchback”, 7), (11, „Barci”, 0), (12, „Liftback”, 8), (13, „Crossover”, 8), (14, „Alb”, 13), (15, „Roșu”, 13), (16, „Negru”, 13), (17, „Verde”, 13), (18, Mazda CX, 3) ), (19, Mazda MX, 3);

    Algoritmul de lucru constă în următoarele:

    Crearea unei conexiuni la baza de date

    query("SET NUMELE "utf8""); /* * Acesta este modul „oficial” orientat pe obiect de a face acest lucru * cu toate acestea $connect_error nu a funcționat până în PHP 5.2.9 și 5.3.0. */ if ($mysqli->connect_error) ( die("Conexiune a eșuat (" . $mysqli->connect_errno . ") " . $mysqli->connect_error); ) /* * Dacă doriți să fiți sigur de compatibilitatea cu versiunile înainte de 5.2 .9, * cod mai bun ca acesta */ if (mysqli_connect_error()) ( die("Conexiune a eșuat (" . mysqli_connect_errno() . ") " . mysqli_connect_error()); )

    Scrierea unei funcții pentru a obține date din tabelul Categorii

    //Obțineți tabloul nostru de meniu din baza de date ca funcție de matrice getCat($mysqli)( $sql = "SELECT * FROM `categories`"; $res = $mysqli->query($sql); //Creați o matrice în care cheia matricei este ID-ul meniului $cat = array(); while($row = $res->fetch_assoc())( $cat[$row["id"]] = $row; ) return $cat; )

    Obținem o matrice ca aceasta, unde cheia matricei este ID-ul categoriei.

    Funcția Array Tree de Tommy Lacroix

    //Funcția de a construi un arbore dintr-un tablou din funcția Tommy Lacroix getTree($dataset) ( $tree = array(); foreach ($dataset as $id => &$node) ( //Dacă nu există atașamente dacă (!$node[" părinte"])( $tree[$id] = &$nod; )else( //Dacă există copii, atunci treceți prin matricea $dataset[$node["părinte"]][" copii"][$id] = &$ nod; ) ) returnează $tree; )

    Obținerea unei matrice sub formă de arbore

    Întregul scenariu

    query("SET NUMELE "utf8""); /* * Acesta este modul „oficial” orientat pe obiect de a face acest lucru * cu toate acestea $connect_error nu a funcționat până în PHP 5.2.9 și 5.3.0. */ if ($mysqli->connect_error) ( die("Conexiune a eșuat (" . $mysqli->connect_errno . ") " . $mysqli->connect_error); ) /* * Dacă doriți să fiți sigur de compatibilitatea cu versiunile înainte de 5.2 .9, * este mai bine să folosiți acest cod */ if (mysqli_connect_error()) ( die("Eroare de conectare (" . mysqli_connect_errno() . ") " . mysqli_connect_error()); ) //Obțineți matricea noastră de meniuri din baza de date ca o funcție matrice getCat($mysqli)( $sql = "SELECT * FROM `categories`"; $res = $mysqli->query($sql); //Creează o matrice în care cheia matricei este meniul ID $cat = array(); while ($row = $res->fetch_assoc())( $cat[$row["id"]] = $row; ) return $cat; ) //Funcție pentru a construi un arbore dintr-o matrice de Tommy Lacroix funcția getTree($dataset) ( $tree = array(); foreach ($dataset as $id => &$node) ( //Dacă nu există atașamente dacă (!$node["părinte" ])( $tree[$id] = &$node; )else( //Dacă există copii, atunci repetați peste matricea $dataset[$node["părinte"]]["copii"][$id] = &$node; ) ) returnează $tree; ) //Obțineți o matrice pregătită cu date $cat = getCat($mysqli); //Creează un meniu arbore $tree = getTree($cat); //Șablon pentru afișarea meniului sub forma unei funcții arborescente tplMenu($category)( $meniu = "
  • ".$category["titlu"].""; if(isset($category["copii"]))( $meniu .= "
      ".showCat($category["copii"]) ."
    "; ) $meniu .="
  • "; return $meniu; ) /** * Citiți șablonul nostru recursiv **/ function showCat($date)( $string = ""; foreach($data as $item)( $string .= tplMenu($item); ) returnează $șir; ) //Obțineți marcaj HTML $cat_menu = showCat($tree); //Afișează ecou "
      ". $cat_menu ."
    "; ?>

    Rezultatul muncii

    Meniu pe mai multe niveluri în PHP + MySQL pentru administrator

    Dacă doriți să utilizați acest meniu în panoul de administrare al site-ului dvs., atunci trebuie să rescrieți câteva funcții tplMenu(), showCat().

    ".$category["titlu"].""; )else( $meniu = " "; ) if(isset($categoria["copii"]))( $i = 1; for($j = 0; $j< $i; $j++){ $str .= "→"; } $i++; $menu .= showCat($category["childs"], $str); } return $menu; } /** * Рекурсивно считываем наш шаблон **/ function showCat($data, $str){ $string = ""; $str = $str; foreach($data as $item){ $string .= tplMenu($item, $str); } return $string; } //Получаем HTML разметку $cat_menu = showCat($tree, ""); //Выводим на экран echo ""; ?>

    Rezultatul muncii

    Selectați Mașini → Mazda →→ Mazda 3 →→→ Sedan →→→ Hatchback →→ Mazda 6 →→→ Liftback →→→ Crossover →→→→ Alb →→→→ Roșu →→→→ Negru →→→→ Verde →→ Mazda CX →→ Mazda MX → Motociclete Honda → Kawasaki → Harley Boats

    Ți-a plăcut articolul? Împărtășește-l