Toen het navigatiemenu-systeem werd uitgebracht met WordPress 3.0, was dit een van de factoren die WordPress van een blogplatform naar een krachtig CMS hebben getransformeerd.

Dit betekende dat u elke gewenste inhoud aan de navigatiemenu's van uw website kon toevoegen, inclusief aangepaste links. De "slepen en neerzetten" -interface betekende dat iedereen zijn eigen aangepaste menu kon maken zonder enige codeervaardigheden.

Maar soms wil je er niet op vertrouwen. Als u een website ontwikkelt voor een klant die pagina's aan zijn website gaat toevoegen, is het onwaarschijnlijk dat hij / zij de navigatiemenu ('s) zal bijwerken als hij / zij de vaardigheden wel of niet heeft. .

Dit is dus waar een geautomatiseerd navigatiemenu van pas komt.

In deze zelfstudie laat ik u zien hoe u een geautomatiseerd navigatiemenu maakt dat alle pagina's van uw website weergeeft, evenals de onderliggende pagina's die worden weergegeven als items op het tweede niveau in het navigatiemenu.

U kunt deze code vervolgens toevoegen aan de koptekst, zijbalk of voettekst van uw thema, als u dat wilt, en dit toont uw gebruikers links die automatisch worden bijgewerkt wanneer nieuwe inhoud wordt aan uw website toegevoegd.

Maar als je WordPress nog nooit hebt geïnstalleerd, ontdek het dan Hoe maak je een WordPress blog 7 stappen te installeren et Hoe te vinden, installeren en activeren van een WordPress theme op uw blog 

Ga dan terug naar waarom we hier zijn.

Dit is wat je nodig hebt om WordPress-navigatiemenu's te automatiseren:

• Een WordPress ontwikkel- of testinstallatie, met een paar pagina's en subpagina's toegevoegd
• Een code-editor.

Code configuratie

Ik zal deze code aan een plug-in toevoegen zodat deze permanent is, zelfs als ik het WordPress-thema verander. Op deze manier kan ik de functie van mijn plug-in toevoegen aan mijn thema om het navigatiemenu toe te voegen waar ik wil. Als uw WordPress-thema " haken U kunt een of meer gebruiken om deze code te injecteren.

Zie ook onze lijst met 10 WordPress plug-ins om een ​​aftelling te maken

Als u werkt met een WordPress-thema van een derde partij dat geen Hooks heeft, moet u code aan het thema toevoegen. Codeer het niet rechtstreeks in het thema: maak in plaats daarvan een child-thema en voeg uw code eraan toe. Maak gewoon een duplicaat van het themasjabloonbestand van het hoofdthema dat u wilt bewerken, voeg het toe aan uw child-thema en bewerk het.

eerste stap

De eerste stap is het maken van de plug-in. Ik maak een map aan in " wp-content/plugins ". Door een map aan te maken, kan ik in de toekomst meer bestanden aan de plug-in toevoegen als dat nodig is, zoals een stylesheet of bestanden toevoegen.

Eerst moet u de inlogcode voor uw plug-in toevoegen in de opmerkingen om WordPress te vertellen wat het is:

<?php
/**
 * Plug-innaam: plug-in
 * Plug-in-URI: http://blogpascher.com
 * Beschrijving: WordPress-plug-in
 * Versie: 1.0
 * Auteur: Herve
 * Auteur-URI: http://blogpascher.com
 *
 */

Activeer nu uw plugin.

Als u een child-thema gebruikt, configureert u dit. Ik gebruik het child-thema van het Twenty Seventeen-thema - hier is mijn stylesheet:

<?php
/**
 * Plug-innaam: plug-in
 * Plug-in-URI: http://blogpascher.com
 * Beschrijving: WordPress-plug-in
 * Versie: 1.0
 * Auteur: Herve
 * Auteur-URI: http://blogpascher.com
 *
 */

@import-URL( " ../twentyseventeen/style.css ");

Als je dat eenmaal hebt gedaan en je website nog geen pagina's heeft, voeg er dan een paar toe. Ze moeten een structuur hebben op verschillende niveaus. Dit is hoe mijn neppagina's eruit zien:

Laten we nu beginnen met het toevoegen van de code aan de plug-in.

Maak een functie om alle pagina's hiërarchisch weer te geven

We zullen de functie «gebruiken wp_list_pages () Om alle pagina's op te halen en ze met links weer te geven. Maar eerst moeten we er enkele argumenten voor definiëren. Begin met het maken van uw functie en voeg deze argumenten toe:

wpmu_list_pages () {wpmu_list_pages () {$ args = array ('depth' => 2); }

De argumenten zijn heel eenvoudig - er is er maar één voor het niveau van de pagina's dat we willen doen. Instelling "2" betekent dat de pagina's op het hoogste niveau en hun subpagina's worden weergegeven, maar niet meer.

Ontdek de 5 verbinding voorkomende fouten en hun oplossingen op WordPress

Laten we nu de functie “wp_list_pages ()” toevoegen na de argumenten:

wp_list_pages ($ args);

Hier is de complete functie:

wpmu_list_pages () {wpmu_list_pages () {$ args = array ('depth' => 2); wp_list_pages ($ args); }

De functie toevoegen aan het thema

Op dit moment laat de functie niets zien op mijn website. Om dit te veranderen, moeten we een kopie van de koptekst van het hoofdthema aan het child-thema toevoegen en dat bewerken.

Zie ook: Hoe u uw WordPress-werk op websites van klanten kunt beschermen

Begin met het kopiëren van uw koptekstbestand naar uw child-thema en open het. In Twenty Seventeen is de navigatiemenucode te vinden in " sjablonen-onderdelen / navigatie / navigatie-top.php Dat betekent dat ik een kopie van dit bestand moet toevoegen aan dezelfde plaats in mijn kindthema.

Ontdek om verder te gaan Hoe maak je een WordPress kind thema te installeren

In uw thema kan dit het bestand zijn header.php dat moet worden gekopieerd.

Afhankelijk van uw thema is de menucode anders. In degene die ik gebruik, is dit de code die ik moet vervangen:

'top', 'menu_id' => 'top-menu',)); ?>

Pas de code van uw navigatiemenu aan om een ​​nieuwe functie toe te voegen, met de bestaande code in een "else {}" verklaring:

'top', 'menu_id' => 'top-menu',)); }?>

Voorwaardelijke verklaringen zijn belangrijk: eerst wordt gecontroleerd of de functie die u aan uw plug-in hebt toegevoegd aanwezig is (d.w.z. als de plug-in is geactiveerd) en als dat het geval is, voert het de functie daarvan uit. Anders werkt het normaal.

Zie ook onze gids over Hoe te advertentie blokken op WordPress weer te geven

Kijk nu naar mijn website:

De links verschijnen, maar er zijn enkele problemen. Ik wil niet dat 'Pagina's' bovenaan worden weergegeven (wat de standaard is voor de functie wp_list_pages () ) en ik wil de pagina's efficiënter ordenen. U zult zien dat de startpagina in het midden van de lijst staat, wat niet ideaal is.

Verbeter de functie

Laten we teruggaan naar de plug-incode en deze aanpassen om deze problemen te verhelpen.

Zoek de argumenten waarvoor u al hebt gedefinieerd wp_list_pages ():

$ args = array ('depth' => 2);

En bewerk het:

$ args = array ($ args = array ('depth' => 2, 'title_li' => ' '. __ ('Menu', 'bpc'). ' ',' sort_column '=>' menu-volgorde ');

Dit voegt twee extra argumenten toe:

• De opmaak vóór de lijst, die nu zegt " Menu In plaats van Pages .
• De volgorde waarin de pagina's worden weergegeven.

U moet terugkeren naar de bewerkingsschermen van uw pagina's en de volgorde van de pagina's voor elk ervan definiëren. Stel uw startpagina in op de waarde "0" en andere pagina's op het hoogste niveau zijn hoger dan deze. 

Lees ook onze gids over : Hoe geleidelijk Facebook- en Disqus-reacties te laden

Wanneer u nu het menu weergeeft, ziet het er als volgt uit:

U kunt ook de menuvolgorde van de pagina's op het tweede niveau wijzigen. Dit zal nooit boven pagina's van het hoogste niveau verschijnen, dus u kunt beginnen met 0 of 1 voor elke set subpagina's.

Ontdek ook enkele premium WordPress-plug-ins  

U kunt andere gebruiken WordPress plugins om een ​​moderne uitstraling te geven en de aansluiting op je blog of website te optimaliseren.

We bieden je hier enkele premium WordPress-plug-ins die je daarbij kunnen helpen.

1. Gravity Forms

Als bedrijfseigenaar moet het uw prioriteit zijn om uw klanten te laten contact met u opnemen. Gravity Forms is de plug-in van Contact formulier het meest populair op WordPress.

Je kunt het gebruiken voor maak elk type formulier, zoals een offerteformulier, enquêtes en meer.

Downloaden | demonstratie | web hosting

2. eForm

eForm is een geavanceerde en flexibele formulierbouwer die kan worden geïntegreerd in een bestaande WordPress-website. Het is een complete oplossing voor formulierbeheer. Dit betreft onder meer quizzen, enquêtes, dataverzameling, betalingsschatting en gebruikerscommentaar.

Met zo'n formulierontwerper kunt u formulieren op een onbeperkte manier ontwerpen en beheren vanaf uw dashboard. Alle verzoeken worden opgeslagen in uw database, u kunt de opgeslagen gegevens bekijken, volgen, analyseren en er naar handelen.

Lees ook ons ​​artikel over Hoe inhouds marketing invloed heeft op uw blog's SEO

Bovendien stelt een gebruikersportaal geregistreerde gebruikers in staat om hun verzoeken te bekijken en te volgen.

Downloaden | demonstratie | web hosting

3. Mailster

Mailster is een WordPress Plugin gebruiksvriendelijke premium waarmee u een nieuwsbrief in uw website kunt integreren. Met de laatste kunt u uw campagnes maken, verzenden en volgen zonder al te veel gedoe.

De belangrijkste kenmerken zijn: de mogelijkheid om open e-mails, klikken, abonnementen en bouncepercentages bij te houden, de mogelijkheid om uw campagnes te targeten, campagnebeheer en planning, ondersteuning voor 6 soorten autoresponders, onbeperkte creatie registratieformulieren, een gebruiksvriendelijke interface, aanpassing van de achtergrond, ondersteuning voor meertaligEn nog veel meer.

Downloaden | demonstratie | web hosting

Aanbevolen bronnen

Lees meer over andere aanbevolen bronnen om u te helpen bij het bouwen en beheren van uw website.

• 8 WordPress-plug-ins om een ​​megamenu op uw blog te maken
• Hoe u recente artikelen op WordPress kunt weergeven
• Hoe maak je een diavoorstelling met Slider Revolution op WordPress
• Hoe te advertentie blokken op WordPress weer te geven

Conclusie

Alstublieft ! Dat is alles voor deze tutorial, ik hoop dat je hiermee automatisch pagina's aan je menu's kunt toevoegen. Als u zich zorgen maakt of suggesties op dit gebied, laten we ons binnen het commentaargedeelte om te bespreken.

U kunt echter ook onze ressources, als u meer elementen nodig hebt om uw projecten voor het maken van internetsites uit te voeren, raadpleeg onze gids op de WordPress blog creatie of die op Divi: het beste WordPress-thema aller tijden.

Maar in de tussentijd deel dit artikel op uw verschillende sociale netwerken.

...