Aparte template aanmaken voor custom post type

Beschikt jouw website over zogenoemde custom post types? En wil je voor deze custom post types een aparte template aanmaken? Dat kan! In dit artikel lees je hoe je dit.

1. Wat is een custom post type?

Een custom post type is in het Nederlands vertaald een berichttype. Net zoals dat je in WordPress je “berichten” en “pagina’s” hebt, kun je ook “aangepaste berichttypes” aanmaken (lees: custom post types).

Voor de meeste gebruikers is dit iets wat je niet snel zelf doet (het aanmaken van een eigen custom post type). Het hebben van een custom post type binnen je WordPress omgeving, heeft er vaak mee te maken dat een plugin dit voor jou heeft gedaan.

Een bekend voorbeeld hiervan is WooCommerce. Zodra je WooCommerce installeert beschik je namelijk over de custom post type “producten”. In dit geval heb je dan de volgende berichttypes op je website: “berichten”, “pagina’s” en “producten”. Omdat het berichttype “producten” niet standaard in WordPress zit, maar aangemaakt is door WooCommerce, noemen we dit een “aangepast berichttype” ook wel custom post type.

2. Hoe maak je een aparte template aan voor een custom post type?

Alle custom post types vallen standaard terug op het “enkel”-template binnen het Affiliate Held Thema. Alle custom post types zijn in het beginsel namelijk hetzelfde als het “berichten” berichttype. Als je voor je custom post type een ander template wilt gebruiken dan het “enkel”-template, dan dien je hiervoor een aparte template aan te maken.

Een aparte template voor je custom post type kun je aanmaken op twee verschillende manieren.

2.1. Methode #1: Site editor

Deze eerste methode is de makkelijkste manier om een aparte template aan te maken voor je custom post type.

  • Navigeer naar je Site editor (Weergave > Editor).
  • Klik rechts bovenaan op “nieuwe toevoegen”
  • Kies vervolgens in de dropdown voor “Enkel item: XXX” waarbij XXX de betreffende custom post type is waarvoor je een template wilt aanmaken (in het screenshot hieronder zie je dat we een aparte template gaan aanmaken voor de custom post type “Test post type”).
  • Zodra je hierop klikt, kan het zijn dat je een pop-up ziet verschijnen als je al berichten hebt toegevoegd aan je custom post type. Je kunt dan namelijk kiezen of je het template wilt laten toepassen op alle berichten binnen je custom post type of dat je het template wilt aanmaken voor één specifiek bericht binnen je custom post type. In dit artikel gaan we ervan uit dat je de nieuwe template wilt toepassen voor alle berichten in je custom post type. Als je onderstaande pop-up niet te zien krijgt, betekent dit dat je nog geen berichten hebt toegevoegd binnen je custom post type en dat de template (bij het klikken op “Enkel item: XXX”) wordt aangemaakt voor alle berichten in je custom post type.
  • Je template wordt nu aangemaakt in de Site editor en de inhoud van je “enkel”-template wordt gebruikt als “basis”. Op die manier hoef je niet vanaf niets de template in te gaan richten. Als je wilt kun je uiteraard alle blokken verwijderen, maar vaak is het handig dat je al beschikt over bijvoorbeeld de header en de footer.

Je template is nu klaar voor gebruik, richt ‘m precies in zoals jij dat wilt. Succes!

2.2. Methode #2: HTML-bestand

2.2.1. Child thema activeren

Voor deze methode is het allereerst belangrijk om het child thema van het Affiliate Held Thema te downloaden, installeren en activeren. Als je namelijk niet het child thema gebruikt, zal na een update van het thema je nieuw aangemaakte template voor je custom post type verdwijnen. Voor meer informatie over hoe een child thema werkt, verwijs ik je graag door naar onderstaande link.

Documentatie: wat is het verschil tussen een parent en een child thema?

2.2.2. Leeg HTML-bestand aanmaken met juiste benaming

  • Maak een leeg HTML-bestand aan op je computer, bijvoorbeeld op je bureaublad (maak hiervoor gebruik van een tekst- of codebewerker).
  • Gebruik voor de naamgeving van het HTML-bestand, onderstaande structuur. Vervang “XXX” met de naam van je eigen custom post type.

single-XXX.html

Hieronder vind je een voorbeeld van hoe jouw bestandsnaam eruit kan zien. Hierbij is “test-post-type” de naam van je eigen custom post type.

single-test-post-type.html

  • Sla het bestand op.

2.2.3. Leeg HTML-bestand uploaden naar “templates” map in je child thema

Als je het child thema geactiveerd hebt op je WordPress website zoals besproken in stap 2.2.1, kun je het lege HTML-bestand dat je hebt aangemaakt bij stap 2.2.2 gaan uploaden naar je website. Uploaden gebeurt via bestandsbeheer van je webhostingpaneel (cPanel, DirectAdmin, Plesk, etc) of via FTP.

Voordat je het bestand upload, is het belangrijk dat je in het child thema een map aanmaakt genaamd “templates”. In die map upload je het lege HTML-bestand.

Een voorbeeld van het pad dat je zojuist hebt gecreëerd is als volgt: XXXXXX.nl/wp-content/themes/affiliate-hero-theme-child/templates/single-XXX.html.

Hierbij is XXXXXX je domeinnaam en XXX de naam van je custom post type.

2.2.4. Je nieuwe custom post type template bewerken

Good job!

Als je tot deze stap bent gekomen, heb je je aparte custom post type template succesvol aangemaakt en ben je klaar om het template te gaan bewerken. Je hebt nu immers een leeg HTML-bestand aangemaakt waar dus nog niks van opmaak of styling in zit. Dit moet je nog gaan doen in de Site editor van WordPress.

Je vindt je nieuwe template door in de achterkant van WordPress te navigeren naar de Site editor (weergave > site editor). Vervolgens zul je onder het tabblad “templates” je nieuwe aangemaakte template zien staan.

Klik vervolgens op dit template en je kunt beginnen met het toevoegen van blokken en je gewenste styling voor je custom post type.

Succes!

    Dit bericht heeft nog geen reacties

Laat een reactie achter

Je e-mailadres wordt niet gepubliceerd. Vereiste velden zijn gemarkeerd met *