Ga naar de inhoud
Sander
Neem contact op
Menu
Neem contact op

WordPress developer · Leeuwarden

Hoe ik met WordPress bouw

Ik ben developer in Leeuwarden en WordPress is waar ik het meest mee bouw. Ook deze site draait erop. Dit is hoe ik het aanpak: een eigen thema, geen pagebuilder, en een beheer waar iemand anders mee verder kan.

Waar ik op let

Zes dingen die in elk thema terugkomen.

  1. 01

    Een eigen thema

    Geen kant-en-klaar thema met een pagebuilder erbovenop, maar code die precies doet wat de site nodig heeft. Tailwind voor de stijl, Alpine.js voor interactie, en beweging alleen waar ze iets toevoegt.

  2. 02

    Beheer dat de inhoud volgt

    Velden en indelingen die de inhoud volgen, zodat een redacteur pagina's samenstelt zonder dat het ontwerp breekt.

  3. 03

    Snelheid vanaf het begin

    Lichte pagina's, afbeeldingen in het juiste formaat en geen script dat niets doet. Deze site is op dezelfde manier gebouwd.

  4. 04

    Toegankelijk en responsive

    Het moet werken op een telefoon, met het toetsenbord en met een schermlezer, niet alleen op mijn eigen scherm.

  5. 05

    WordPress als backend

    Soms is WordPress alleen het beheer, met een frontend in Next.js ervoor. Zo werkt Oursondenaissance, met WooCommerce erachter.

  6. 06

    Code die een ander kan lezen

    Een duidelijke opzet en leesbare code, zodat de volgende developer niet hoeft te raden.

Hoe zit dit thema in elkaar?

Deze site is het voorbeeld. Het thema bestaat uit gewone PHP-templates met losse onderdelen per sectie, zonder pagebuilder en zonder jQuery. De stijl komt uit Tailwind en wordt met Vite tot één stylesheet gebouwd van 18 kB (gezipt). Het script is 42 kB, met Alpine.js voor interactie en Motion voor beweging. De lettertypen staan op de eigen server.

De inhoud zit in velden per paginatype: een projectpagina heeft andere velden dan de homepage of een blogpost. Die veldgroepen staan als JSON in het thema en gaan dus mee in versiebeheer, net als de code. Wie de site beheert, ziet per pagina alleen de velden die daar iets doen.

Een wijziging gaat via Git. Na een push bouwt GitHub Actions het thema en zet het op de server, in ongeveer veertig seconden. De site staat in twee talen, Engels en Nederlands, waarbij elke vertaling een eigen pagina met eigen velden is.

stylesheet, gezipt
18 kB
script, gezipt
42 kB
pagebuilders
0
van push tot live
40 s

Gebouwd met WordPress

Projecten waarvan ik het thema en het beheer heb gemaakt.

Bekijk al het werk

Vaak in dezelfde projecten

  • Alpine.js
  • PHP
  • Tailwind
  • GSAP
  • Vite
  • Docker

Hoe ik werk

Heldere keuzes, korte rondes en iets echts om op te reageren.

  1. Vind de echte behoefte

    Voordat ik een stack kies, maak ik het doel, de gebruiker en de kleinste versie die het bouwen waard is helder.

  2. Bouw precies genoeg

    Ik kies de simpelste stack die past en werk dan snel toe naar iets dat echt genoeg is om te testen en te verbeteren.

  3. Verfijn de ervaring

    Responsive gedrag, subtiele beweging, toegankelijke keuzes, leesbare code en een helder CMS maken van een werkende build een product dat af is.

Vragen

Wat ik er vaak over hoor.

  1. Een pagebuilder laadt code voor alles wat hij kan, ook voor wat de site nooit gebruikt. Een eigen thema bevat alleen wat nodig is. Dat scheelt laadtijd en houdt het beheer overzichtelijk.

  2. Ja. Het beheer wordt ingericht op de inhoud. Bij het portfolio van Thijs Veldwisch stelt hij zijn projecten zelf samen in de editor, uit een vaste set medialayouts.

  3. Ik kies de simpelste stack die past. Draait het om inhoud die iemand zelf beheert, dan is WordPress vaak genoeg. Is het een product met accounts en eigen logica, dan bouw ik het liever in Next.js.

  4. Ja. Een eigen thema met Tailwind en Vite, zonder pagebuilder, gebouwd op de manier die op deze pagina staat.

  5. Niet uit zichzelf. Traag wordt het door wat erop gestapeld wordt: een pagebuilder, zware plugins, grote afbeeldingen. Met een eigen thema en één klein stylesheet blijft er weinig over dat kan vertragen.

  6. Ja. Deze site staat in het Engels en het Nederlands. Elke vertaling is een eigen pagina met eigen velden en een eigen adres, en de twee verwijzen naar elkaar.

Welke stack wanneer

Ik kies de simpelste die past.

Stack Wanneer
WordPress Inhoud die iemand zelf beheert: een site, een portfolio, een blog.
Expo Iets dat je bij je hebt en dat je moet herinneren: een app.
Next.js Een product met accounts, eigen logica of veel interactie.
Laravel Een applicatie met gebruikers, rechten en veel data.