Contextgevoelige zijbalknavigatie creëren in WordPress

Soms krijg ik een clientjob waarvoor een site volledig op pagina's is gebouwd. Geen ingewikkelde databasequery's, geen extra sjabloonbestanden - slechts een heel aantal pagina's in een hiërarchische structuur.

Een zeer grote site die op pagina's is gebouwd, kan onpraktisch en verwarrend voor gebruikers worden als de navigatie niet goed wordt uitgevoerd, dus het is handig om een ​​lijst met alle pagina's in de huidige tak van de paginahiërarchie op elke pagina op te geven.. 

Als uw site bijvoorbeeld voor een organisatie is en elk van de functies van de organisatie een pagina op het hoogste niveau met subpagina's voor afzonderlijke afdelingen heeft, dan wilt u al deze afdelingen samen met een koppeling naar de functiepagina op het hoogste niveau weergeven. U wilt dit doen op elk van die afdelingspagina's en op alle subpagina's die ze kunnen hebben, evenals met de pagina op het hoogste niveau zelf.

Om dit te doen, kunt u geen lijsten met verwante inhoud uitvoeren door query's uit te voeren voor het huidige berichttype of de taxonomieterm. In plaats daarvan moet u bepalen waar in de structuur de huidige pagina zich bevindt en vervolgens een lijst met links weergeven.

Hier laat ik je zien hoe je dit kunt doen, door een functie te maken die je aan je zijbalkbestand kunt toevoegen of misschien boven de inhoud in je sjabloonbestanden (of activeer via een haak als je thema die gebruikt).

Dit bestaat uit twee fasen:

1. identificeren waar de huidige pagina zich in de structuur bevindt
2. het uitvoeren van een lijst met pagina's

Wat je nodig hebt

Om deze tutorial te voltooien, heb je nodig:

• een installatie van WordPress
• een teksteditor

Uw invoegtoepassing maken

Ik ga deze functie in een plug-in maken, zodat het thema onafhankelijk is. Dus je eerste stap is om een ​​plug-in bestand te maken. De mijne wordt genoemd tutsplus-list-subpages.php.

Open uw plug-in bestand en voeg het volgende toe:

Het is duidelijk dat uw code anders zal zijn, omdat de auteur en URL van de plug-in zullen veranderen en u de beschrijving mogelijk wilt wijzigen. 

Het opnemen van de naam van de functie in de beschrijving is nuttig omdat dit betekent dat wanneer u uw plug-in op een site installeert, u de code niet hoeft te controleren om eraan te herinneren hoe u deze moet gebruiken.

De huidige pagina in de hiërarchie identificeren

Als u wilt weten waar de huidige pagina zich in de paginahiërarchie bevindt, moet u vier dingen doen:

1. Controleer of dit eigenlijk een pagina is
2. Controleer of dit bericht ouders heeft
3. Zo niet, dan weet je dat dit de hoogste voorouder is voor dit deel van de hiërarchie
4. Als dit het geval is, moet u de bovenliggende voorouder identificeren met get_post_ancestors ()

Dus laten we het doen!

Maak een nieuwe functie met een voorwaardelijke tag erin om te controleren of we op een pagina staan:

Nu, binnen de is_page () voorwaardelijke tag, begin met het definiëren van de $ bericht globale variabele:

Vervolgens moet je bepalen of de huidige pagina ouders heeft, die je gebruikt if (& post-> post_parent):

post_parent) ?>

Als de pagina al zijn voorouders heeft, moet u de top van deze identificeren, die u gebruikt get_post_ancestors ():

post_parent) // haal de lijst met voorouders $ parents = array_reverse (get_post_ancestors ($ post-> ID)); // haal de bovenliggende voorouder terug $ ouders [0]; ?>

Dit definieert een nieuwe variabele van $ ouders waarvan de waarde de ID van de bovenste pagina in de huidige tak van de hiërarchie is. De lijn $ ouders terugsturen [0]; geeft die waarde uit, zodat u deze kunt gebruiken in een latere functie.

Ten slotte moet u definiëren wat er gebeurt als de huidige pagina geen ouders heeft, dus als dit de bovenste voorouder zelf is. In dat geval wilt u de ID van de huidige pagina uitvoeren, dus u voegt het volgende toe aan uw functie:

return $ post-> ID;

Je hele functie ziet er nu als volgt uit:

post_parent) // haal de lijst met voorouders $ parents = array_reverse (get_post_ancestors ($ post-> ID)); // haal de bovenliggende voorouder terug $ ouders [0];  // retourneer de id - dit is de bovenste voorouder als deze er is, of de huidige pagina als niet $ post-> ID retourneert; ?>

Een lijst met subpagina's uitvoeren

Nu u de ID van de bovenste pagina in de huidige tak van de hiërarchie kent, is het uitvoeren van een lijst van de subpagina's relatief eenvoudig. Je gebruikt get_pages () om de onderliggende pagina's van de pagina te identificeren waarvan u de ID heeft geïdentificeerd. U moet ook een koppeling naar de voorouderpagina uitvoeren aan het begin van de lijst.

List_pages () gebruiken om subpagina's te identificeren

Begin met het maken van een nieuwe functie met een vinkje dat we op een pagina staan:

Merk op dat als u deze functie gaat toevoegen aan uw page.php sjabloon, kunt u de controle achterlaten dat een pagina wordt weergegeven.

Het eerste dat u in die voorwaardelijke tag moet doen, is het ophalen van het pagina-ID dat u hebt geïdentificeerd in de tutsplus_check_for_page_tree () functie, wat je doet met deze regel code:

$ ancestor = tutsplus_check_for_page_tree ();

Definieer hieronder de argumenten voor de get_pages () functie:

$ args = array ('child_of' => $ ancestor, 'depth' => '-1', 'title_li' => ",);

Laten we even kijken naar de argumenten die ik heb gebruikt:

• 'child_of' => $ voorouder identificeert die pagina's die een kind van de zijn $ voorouder pagina
• 'diepte' => '-1' vertelt de functie om naar zoveel niveaus in de hiërarchie te gaan als er op de site zijn. U kunt dit wijzigen als u slechts één of twee niveaus wilt weergeven.
• 'title_li' => " zorgt ervoor dat de uitvoer niet is ingepakt in HTML-tags - zoals ik die later zal toevoegen.

Vervolgens moet u het list_pages () functie:

$ list_pages = get_pages ($ args);

De lijst met pagina's uitvoeren

Nu dat u uw pagina's hebt, moet u ze uitvoeren met koppelingen. Controleer dit eerst om dit te doen list_pages () heeft geen lege array geretourneerd:

if ($ list_pages) 

Binnen die controle is de eerste link naar de pagina op het hoogste niveau:

  
 "> 
 

En dan onder dat eerst