WordPress-thema’s zijn er in overvloed. Alleen al op WordPress.org en Themeforest.net kun je kiezen uit duizenden mooie, kant-en-klare thema’s voor je blog, webshop of website. Wil je toch iets anders? Zelf een WordPress-thema ontwikkelen is een prima optie. Dat kan op verschillende manieren. Met deze 7 tips zorg je voor een optimaal resultaat als je zelf aan de slag gaat met het ontwikkelen van een WordPress-thema.
Lees ook: Going international! Een Nederlandse website uitbreiden
1. Kies een methode die bij je past
Je eigen WordPress-thema ontwikkelen kan op verschillende niveaus, het is daarbij belangrijk dat je dit doet op de manier die het beste bij je past. Er zijn een aantal mogelijkheden als je zelf een WordPress-thema ontwikkelen gaat. Dit zijn de drie meest gebruikte manieren:
Pas een bestaand WordPress-thema aan
Waarom zou je makkelijk doen als het nog makkelijker kan? Een bestaand WordPress-thema is vaak al van alle ins en outs voorzien. De structuur en functionaliteit is al opgezet, en dat scheelt je een hoop tijd. Bestaande thema’s zijn op veel punten te veranderen – óók als je geen kaas hebt gegeten van coderen. Als je niet al te veel ingewikkelde of afwijkende eisen stelt aan je thema, is dit dus een uitstekende methode.
Let op: zorg er wel voor dat je CSS wijzigingen aanbrengt in een zogenaamd child theme: doe je dit niet, dan worden je wijzigingen bij elke update weer gereset en kun je alles opnieuw doen.
Gebruik een starter-thema
Dat is in feite niets anders dan een zeer uitgekleed WordPress-thema. Een blanco basisversie dus, die je kopieert, een andere naam geeft en daarna helemaal naar wens verder opbouwt. Je kunt je dan helemaal uitleven op het gebied van stijl en functionaliteit. Underscores is een populair starter theme, net als Generic. Ga je aan de slag met een starter theme, dan zul je wel moeten werken met codering, zoals CSS, HTML en PHP. Heb je hier geen ervaring mee, dan is dit misschien niet de beste methode voor het opzetten van je eigen WordPress-thema.
Bouw je WordPress-thema helemaal zelf op
Een template ‘from scratch’ bouwen kost (veel) meer tijd, maar dan heb je ook een uniek thema dat 100% voldoet aan al jouw eisen. Voorwaarde is wel dat je een expert bent in HTML, PHP en CSS. Heb je hier niet voldoende kennis van in huis, begin er dan vooral niet aan. Voor wie dit wel een leuke uitdaging lijkt: doen! Je creëert een unieke website en het is nog leerzaam ook. Zet je jouw template goed op, dan kan je deze ook bij volgende projecten opnieuw gebruiken. Zo hebben we bij Web Whales ook onze eigen starter thema ontwikkeld dat we als basis gebruiken voor de maatwerk websites en webshops die we ontwikkelen.
2. Zorg voor een updatebaar thema
Als je zelf een WordPress thema maakt, wil je natuurlijk wel dat hij ook na een aantal maanden/jaren nog goed werkt. Bovendien zit niemand te wachten op een site met een openstaand beveiligingsprobleem. Zorg er daarom voor dat je thema goed updatebaar is. Werk bijvoorbeeld met modules in plaats van een grote brij aan codes te schrijven. Hapklare brokken zijn makkelijk eruit te pakken en te updaten of aan te passen. Een goede updatebaarheid is vooral ook van belang als je je zelfgemaakte WordPress-thema wilt toepassen op meerdere sites. Je wordt dan een thema-uitgever en kunt nieuwe versies van het thema aanbieden aan jouw klanten. Let bij dit onderdeel goed op de inrichting van je thema. WordPress heeft hier zelf namelijk ook over nagedacht en we adviseren je hierin dicht bij de WordPress werkwijze te blijven.
3. Maak gebruik van een Visual Content Editor (of juist niet)
Misschien vind je het handig om tijdens het ontwikkelen direct te zien wat je bouwt. Met een Visual Content Editor of Pagebuilder kan dat. Deze programma’s zijn gebaseerd op een WYSIWYG (what you see is what you get)-techniek, oftewel: je ziet direct het resultaat. De meeste kant-en-klare WordPress-thema’s zijn standaard voorzien van een Visual Content Editor, maar je kunt deze ook als plug-in downloaden.
Met een Visual editor voeg je in enkele muisklikken verschillende functionaliteiten of content blokken toe aan je website. Denk aan video’s, formulieren, banners en sliders. Heeft je klant geen verstand van coderen, dan kun deze met behulp van de editor toch zelf elementen aan zijn website toevoegen.
Er zijn verschillende van dit soort plug-ins verkrijgbaar, zowel gratis als premium-versies. Bekende namen zijn bijvoorbeeld Visual Composer, Elementor of Divi.
4. Voor- en nadelen van een Visual Content Editor en Pagebuilder
Het grote voordeel van de Visual Content Editor en pagebuilders is natuurlijk het gemak. Je kunt, zonder kennis te hebben van coderen, een mooi, goed functionerend WordPress website in elkaar zetten. Je hoeft hiervoor dus geen ontwikkelaar in te huren, en dat scheelt een hoop kosten.
Maar niet iedereen is fan van hulpmiddelen als de Visual Content Editor en pagebuilders. Er kleven namelijk ook een aantal nadelen aan deze methode. Gebrek aan originaliteit is daar één van. Want hoewel de editors en pagebuilders redelijk wat mogelijkheden bieden qua lay-out en stijl, ben je dus toch gebonden aan een vooraf vastgesteld aantal opties. Je thema wordt dus nooit helemaal uniek of voldoet toch net niet helemaal aan je eisen.
Daarnaast zullen programmeurs er vaak voor kiezen de opmaak van hun website op een plek te regelen (in het Child theme). Een pagebuilder zorgt er namelijk voor dat er een extra laag ontstaat waarin wijzigingen gemaakt kunnen worden. Hierdoor wordt het onderhouden of aanpassen van een website op de lange termijn lastiger.
Uiteraard zijn er andere opties. Zo kun je in de Visial Editor meestal ook switchen naar het tabje Tekst of Code. Je kunt dan alsnog HTML-codes toevoegen waarmee je je eigen layout en stijl-opties creëert voor je template. Wil je deze op maat gemaakte opties vaker gebruiken, dan kun je ze toevoegen aan een eigen bibliotheek met blokken binnen de pagebuilder.
5. Denk aan de snelheid van je website!
Zelf een WordPress-thema bouwen is leuk, maar alleen als het thema de functionaliteit en snelheid van je site niet belemmert. Denk daarom aan het volgende:
- Gebruik niet iedere plug-in of script dat je tegenkomt op het internet. Ze hoeven bij lange na niet efficiënt geschreven te zijn en kunnen daardoor de laadtijd van je site vertragen. Helaas kom je hier vaak pas achter nadat je de plug-in of het script zelf hebt getest en een snelheidsanalyse hebt gedaan.
- Beperk en optimaliseer database queries. Een trage database is vaak een belangrijke oorzaak van lange laadtijden of websites die helemaal vastlopen. Teveel joins en rijen kunnen de oorzaak zijn van een trage database. Daarnaast kan een gebrek aan indices je queries vertragen. Je lost dit op door je databaseontwerp te optimaliseren. Je krijgt dan kleinere tabellen en meer joins in de queries. Zo is er minder opslagruimte nodig en voorkom je het meervoudig vastleggen van gegevens.
- Optimaliseer de caching-configuratie. Dat zorgt ervoor dat het merendeel van je bezoekers statische HTML-pagina’s te zien krijgt, wat enorm veel laadtijd scheelt. Je kunt hierbij gebruik maken van een caching-plug-in, zoals WP Super Cache of dit op serverniveau regelen.
- Optimaliseer afbeeldingen. Comprimeer afbeeldingen (dit kan automatisch via diverse plugins) en maak ze nooit groter dan het maximale formaat dat in je thema is vastgelegd. Daarnaast kan je in jouw thema op verschillende schermformaten verschillende afbeeldingformaten aanroepen. Hierdoor laad je slechts in wat je nodig hebt. Zo voorkom je dat een grote afbeelding voor een desktop scherm ook wordt gebruikt in de mobiele versie. Tot slot kan je ondersteuning voor WebP inbouwen, dit is een nieuw afbeeldingsformaat dat nog sneller laadt.
6. Beveilig de content uit de database
Safety first! Goed beveiligde content in de database vermindert de kans op een gehackte site aanzienlijk. Allereerst neem je natuurlijk de gebruikelijke beveiligingsmaatregelen zoals een sterk wachtwoord en het regelmatig updaten van WordPress, je thema en de plug-ins. Let daarnaast op de volgende zaken:
- Voorkom een XSS-aanval. Cross Site Scripting (XSS) is een van de meest voorkomende hackmethoden. Je verkleint de kans hierop door alle input van gebruikers goed te filteren. Voeg bovendien een ReCaptcha in je thema toe op de plekken waar je gebruikers informatie kunnen verzenden, zoals een forum of een formulier.
- Gebruik altijd de nieuwste versie van PHP. Die wordt volledig ondersteund, waardoor de kans op beveiligingslekken vermindert.
Er zijn veel plug-ins waarmee je je website goed kunt beveiligen. Wordfence is daar een voorbeeld van. Ben je een beetje handig met coderen, dan kun je ook zelf bepaalde veiligheidsmaatregelen inbouwen. Zo kun je bijvoorbeeld met behulp van snippets belangrijke bestanden beschermen en de toegang tot PHP-bestanden beperken.
7. Vergeet de technische SEO-optimalisatie niet
Een website is pas een succes als Google hem kan vinden. Je denkt misschien dat SEO vooral belangrijk is voor de content van je site, maar dat is slechts een onderdeel van het speelveld. Ook de manier waarop je website technisch in elkaar zit, telt mee in Googles beoordeling. Een paar tips:
- Maak de website goed vindbaar voor crawlrobots. Dat doe je onder andere door een robots.txt-bestand aan te maken. Hierin kun je informatie zetten over de inhoud van de site.
- Registreer een XML-sitemap via de Google Search Console én vermeld deze optioneel ook in het robot.txt-bestand.
- Google houdt van beveiligde sites. Zorg er daarom voor dat je HTTPS implementeert op je site. Daarvoor heb je wel een zogenaamd SSL-certificaat nodig.
- Zorg voor een website die ook goed werkt op een tablet en mobiel. Maak je WordPress-thema dus altijd responsive! Google hanteert inmiddels verschillende indexes (rankings) voor de desktop en mobiele versies van je website.
- Implementeer een redirect-tool of plug-in om bezoekers van eventuele vervallen pagina’s te verwijzen naar een andere pagina.
Uiteraard zijn er nog veel meer manieren om je technische SEO te optimaliseren. Het is zeker de moeite waard om je hier eens in te verdiepen!
Bonus: Gebruik goede tools
Tot slot: schroom niet om wat online hulpmiddelen te gebruiken. De juiste tools kunnen verdraaid handig zijn als je zelf een WordPress-thema aan het opbouwen bent. Er zijn veel plug-ins en websites die je een hoop tijd en gedoe besparen tijdens het ontwikkelen. Een paar must-haves:
– WordPress Codex. Hét online naslagwerk van WordPress.org met een speciale sectie over theme development. Hier vind je veel informatie over de technische aspecten van de WordPress thema-opbouw.
– Stack Overflow een online community waar je al je vragen over coderen kwijt kunt (en meestal ook antwoorden krijgt). Handig hulpmiddel als je je WordPress-thema ‘from scratch’ gaat ontwikkelen.
– Theme Check, een plug-in die nagaat of je zelfgemaakte thema voldoet aan alle eisen. De plug-in voert dezelfde tests uit die WordPress gebruikt.
– WP Staging. Creëert een kloon van je website waarop je je wijzigingen kunt testen zonder dat iemand het ziet. Ideaal om na te gaan hoe je zelfgemaakte thema eruitziet en of alles goed functioneert voordat je het live zet.
– Github. Als je zelf een thema ontwikkeld dan is versiebeheer essentieel. Github is voor menig ontwikkelaar dagelijkse kost.
Verloopt het bouwen van je WordPress-thema toch niet zoals je had gehoopt? Dan kun je natuurlijk altijd onze hulp inschakelen. Web Whales heeft al veel professionele, snelle en veilige WordPress-thema’s op maat verzorgd. Bel of mail even met je vraag, we helpen je graag verder.
