UPDATE: DIT IS SINDS KORT OOK MOGELIJK MET ELEMENTOR PRO.
Er zijn weinig dingen die ik mis aan Elementor, maar als ik toch iets moet noemen dan is het wel de mogelijkheid om gerelateerde berichten te tonen. Een blog lay-out maak ik altijd met behulp van de single templates van Elementor. Deze overschrijft de template instellingen van je thema en daarmee dus ook de gerelateerde berichten.
Hoewel je met de ‘Posts’ widget wel berichten kunt inladen onder je blogartikelen, kun je dit niet doen op basis van gerelateerde tags of categorieën. In ieder geval niet zonder kennis van coderen. Ben je daar wel handig mee? Dan kun je ook de instructies van Elementor volgen. Maar.. ik heb ook een oplossing gevonden voor als je geen kennis hebt van code: Met plugin JetElements kun je gerelateerde berichten weergeven met Elementor.
Gerelateerde berichten weergeven in 4 stappen
Stap 1: Installeer JetElements
JetElements is een betaalde plugin. Deze schaf je aan via Crocoblock. Wil je meer doen met Elementor? Dan kan ik je aanraden om alle plugins van Crocoblock in één keer aan te schaffen. Ik heb er al veel plezier van gehad!
Stap 2: Voeg de Posts widget van JetElements toe
Je hebt nu een extra ‘Posts’ widget in je Elementor panel. Deze heet ook ‘Posts’ (rechtsbovenin), maar heeft een ander icoontje. Voeg deze toe aan je pagina.
Stap 3: Gerelateerde berichten instellen
Je kunt nu aangeven welke gerelateerde berichten je wilt tonen. In het voorbeeld hieronder tonen we gerelateerde berichten op basis van de tags in het huidige bericht. Maar je kunt hier eventueel ook categorieën of andere taxonomieën voor gebruiken.
Stap 4: Posts vormgeven
Net als met de Posts widget van Elementor, kun je met deze widget ook de weergave van je posts aanpassen naar wens. Je hebt hier wel wat meer opties dan met de post widget van Elementor Pro. Dat lijkt handig, maar daardoor ben je ook even net iets langer bezig (is onze ervaring).
Gerelateerde berichten tonen met Listings van JetEngine
Gebruik je ook de plugin JetEngine van Crocoblock? Dan kun je ook de lay-out van de posts aanpassen met de ‘Listings’ functie. Hoewel je qua design veel kunt met de Posts widget van JetElements en Elementor Pro, biedt ‘Listings’ de mogelijkheid om custom designs te maken voor je Posts. Dit is interessant als je een specifiek design hebt voor het weergeven van je blogartikelen. Hoe dit precies werkt, leggen we binnenkort uit in een nieuw artikel. In dit artikel laat ik je zien hoe je gerelateerde berichten toont met Listings van JetEngine.
Listing grid toevoegen aan je blogpagina
Als je een Listing hebt gemaakt, kun je deze toevoegen aan je het blog template die je hebt gemaakt met Elementor.
- Ga naar templates -> single template en bewerk het template dat je gebruikt voor je blogartikelen
- Zoek de widget ‘Listing grid’ en voeg deze toe
- Selecteer vervolgens de listing die je wilt gebruiken
Gerelateerde berichten op basis van tags instellen
Nu komt het ‘lastige’ gedeelte. Je gaat nu instellen welke berichten je wilt tonen. In dit artikel ga ik even uit van gerelateerde tags.
- Ga naar het tabje ‘Posts Query’ en voeg een query toe.
- Stel deze in op het type ‘Tax Query’ en selecteer vervolgens ‘Tags’
- In het veld ‘Terms’ vul je %current_tags% in. Je ziet nu direct de gerelateerde berichten verschijnen.
Huidige pagina uitsluiten voor gerelateerde berichten
Tot slot is het handig om de huidige pagina uit te sluiten bij het tonen van de gerelateerde berichten.
- Voeg een nieuwe query toe en selecteer het type ‘Posts Parameters’
- Vul bij ‘Exclude posts by ID’s %currend_id% in. Het huidige bericht wordt nu niet langer getoond.
