Door Jasper Denkers van Developtheweb.nl
Het thema wat we tot nu toe gemaakt hebben, geeft alleen nog ‘statische’ inhoud weer. WordPress heeft een speciale methode om de pagina’s dynamisch te maken. Dat wil zeggen dat er met een bepaald bestand, bijvoorbeeld index.php, pagina’s met verschillende inhoud kunnen worden weergegeven. Deze speciale methode wordt ‘The Loop’ genoemd.

The loop

‘The loop’ wordt door WordPress gebruikt om de inhoud van een pagina weer te geven. Een simpele ‘loop’ ziet er in als volgt uit:

Je kunt deze plaatsen in het bestand index.php. Dat geeft dan het volgende resultaat:

Als bovenstaande code in index.php is opgeslagen, zul je zien dat wanneer je je website opent, er wél wat wordt weergegeven. Standaard worden op een voorpagina van een WordPress website de als laatst geplaatste berichten weergegeven, dat wordt nu ook gedaan.

Wat doet ‘The Loop’?

‘The Loop’ kijkt eigenlijk eerst welke ‘posts’ er moeten worden weergegeven. Wanneer een pagina wordt geopend, zal ‘The Loop’ dus maar één keer worden uitgevoerd. Maar op een blogpagina bijvoorbeeld wordt dit meerdere keren gedaan.

‘The Loop’ wordt meerdere keren uitgevoerd en er worden dus ook meerdere berichten weergegeven. In WordPress kan een ‘post’ van alles zijn, een bericht, een pagina, maar ook door plugins toegevoegde soorten ‘posts’.

In ‘The Loop’ kun je gebruik maken van allerlei speciale WordPress functies. De twee bekendste, die ook in het voorbeeld zijn gebruikt, zijn the_title() en the_content(), welke respectievelijk de titel van het bericht en de inhoud weergeven.

Je hoeft overigens geen ‘<p>’ tags om de inhoud van een bericht te zetten, dat doet WordPress automatisch.

Daarnaast wordt in het bovenstaande voorbeeld de functie the_permalink() gebruikt. Deze functie geeft de URL van het bericht.

De uitvoering

Alle code, HTML en PHP, die je binnen ‘The Loop’ plaatst worden elke keer uitgevoerd wanneer ‘The Loop’ wordt uitgevoerd. Wanneer een blogpagina dus vijf berichten weergeeft, zal daarvoor alle code die binnen ‘The Loop’ staat vijf keer worden uitgevoerd.

‘The Loop’ op twee verschillende manieren gebruikt

Zoals we in de het eerste deel van deze serie bekeken, zijn er voor verschillende soorten pagina’s van je website verschillende themabestanden te gebruiken. We gaan nu de bestanden single.php en page.php maken en we bekijken hoe we daarin ‘The Loop’ kunnen gebruiken.

Dit zijn de themabestanden die respectievelijk gebruikt worden om een los bericht of artikel weer te geven en om een pagina weer te geven.

Page.php

We beginnen met het eenvoudigste themabestand, page.php. Deze is het eenvoudigst, omdat hier alleen de titel en de inhoud weergegeven moet worden. We gebruiken weer ‘The Loop’ en dat resulteert in de volgende code voor page.php:

We gebruiken nu niet de link in de titel, het bestand wordt namelijk gebruikt om een pagina weer te geven en het zou dus niet logisch zijn de titel naar zichzelf te laten verwijzen.

Single.php

We bekijken nu single.php. Deze is wat ingewikkelder. Naast de titel en de inhoud van een bericht, moet ook de auteur, datum van publicatie, de categorieën waarin het bericht is geplaatst en bijvoorbeeld de tags worden weergegeven. Voor deze onderdelen heeft WordPress speciale functies welke in ‘The Loop’ gebruikt kunnen worden.

De auteur

De auteur van een bericht kan worden weergegeven met de functie php the_author(). Je kunt dat bijvoorbeeld doen door de volgende regel in single.php te plaatsen:

Auteur: 

De datum
Voor de datum is eenzelfde soort functie: the_time(). Je plaatst dit bijvoorbeeld als volgt in het bestand:

Gepubliceerd: 

Binnen de haakjes geef je tussen aanhalingstekens het formaat aan waarmee de datum moet worden weergegeven. Hieronder vind je een overzicht met daarin de letters die je hiervoor kunt gebruiken en waar deze voor staan:

Dagen

d – Geeft de dag van de maand als nummer, van 01-31.
j – Hetzelfde als ‘d’, alleen dan van 1-31. Hierbij worden de cijfers 1 t/m 9 zonder nul ervoor weergegeven.
l – Geeft de naam van de dag (in het Engels).
D – Geeft de 3 letterige afkorting van de dag (Engels).

Maanden

m – Geeft het nummer van de maand, van 01-12.
n – Hetzelfde als m, maar dan met de cijfers 1 t/m 9 zonder nul ervoor.
F – Geeft de Engelse naam van de maand.
M – Geeft de Engelse 3 letterige afkorting van de maand.

Jaar

Y – Geeft het jaartal in 4 cijfers.
y – Geeft de laatste 2 cijfers van het jaartal.

Tijd

G – Het uur van de tijd, tellend van 0-23. De cijfers 0 t/m 9 hebben geen voorgaande nul.
H – Hetzelfde als G, maar dan inclusief de voorgaande nullen.
i – Het aantal minuten, van 00 to 59.
s – Het aantal secondes, van 00 tot 59.

De categorieën

De functie die wordt gebruik om de categorieën van het bericht te laten zien is the_category(). Je kunt tussen de haakjes een parameter meegeven waarmee je een scheiding tussen de verschillende categorieën kunt bepalen. Dat gaat bijvoorbeeld zo:

Categorieën: 

Als scheiding wordt nu ‘, ‘ gebruikt. Dit geeft het volgende resultaat:

Categorieën: Categorie 1, Categorie 2, Categorie 3

De tags

the_tags() is de functie waarmee de tags van een bericht kunnen worden weergegeven. Het is gebruikelijk de eerste twee parameters van deze functie te gebruiken. Bijvoorbeeld zo:

Tags: ', ', '); ?>

Met de eerste parameter kun je aangeven wat er voor de tags moet worden weergegeven. De tweede tag geeft het scheidingsteken aan net zoals bij de categorieën. Bovenstaande code geeft een resultaat zoals onderstaand:

Tags: Tag1, Tag2, Tag3

Het resultaat

We hebben nu twee verschillende pagina’s gemaakt, single.php en page.php. Als je niet goed weet hoe je de functies die net besproken zijn moet toepassen, krijg je hieronder een voorbeeld voor hoe je single.php zou kunnen inrichten.

		
		

			

			
Auteur: 
			
Gepubliceerd: 
			
Categorieën: 
			
			
Tags: ', ', '); ?>
			
		
		

Mocht je het thema wat we tot nu toe gemaakt hebben live willen bekijken, kan je deze hier downloaden: voorbeeldthema-2.zip.

Je kunt natuurlijk ook het thema uitpakken om de themabestanden te kunnen bekijken.

In het volgende deel gaan we kijken hoe we een thema plugin-vriendelijk maken en we kijken naar het toevoegen van menu’s in je thema.

Les 1 – Les 2