Maak je eigen plugin in WordPress

We hebben jullie al een keer meegenomen in de wondere wereld van WordPress plugins. Deze week gaan ik uitleggen hoe je zelf een plugin kan maken aan de hand van een klein voorbeeld. Ik ga je laten zien hoe je een kleine plugin kan maken die bootstrap functionaliteit toevoegt aan je website.

We hebben het in eerdere artikelen wel eens gehad over WordPress Plugins hoe makkelijk ze zijn en hoeveel je ermee kan. En hoewel het misschien lastig lijkt om een plugin te maken het begin is eigenlijk heel simpel. Alleen bij de grote plugins heb je wel wat verstand nodig van programmeren in PHP maar voor een kleine plugin volstaat het om basis programmeer vaardigheden te hebben. Nu we vast hebben gesteld dat iedereen (‘die de basis programmeer vaardigeheden heeft’) het kan dan komt nu de vraag waarom zouden we het doen?

Waarom een plugin?

Extra functionaliteit schrijven voor je website is hardstikke leuk en hardstikke handig maar waarom zouden we het in een plugin stoppen terwijl we het ook in de functions.php file kunnen stoppen van het thema. Waarop ik zeg: “ja dat kan maar ik ben lui” stel nou dat we de functionaliteit die we net hebben ontwikkeld voor website A ook nodig hebben voor website B en C. Nu kunnen we de code van A natuurlijk naar B en C kopieren maar als we het in een plugin hadden gezet is het simpel een kwestie van de plugin activeren op B en C.

Of een 2e voorbeeld stel we hebben de functionaliteit in website A zitten en jij of de klant voor wie jij de website hebt gemaakt wil een ander thema omdat dat veel beter aansluit bij je wensen of juist dat specifieke stukje functionaliteit heeft dat je altijd al gemist had. Als je code in het thema had gestaan was het nu weg maar met een plugin hoef je helemaal niks te doen.

Je eerste plugin!

Nu we hebben vastgesteld dat plugins eigenlijk best wel nuttig zijn ga ik je laten zien dat de eerste paar stappen om een plugin te maken vrij eenvoudig zijn. Voordat je gaat beginnen met een plugin maken is het altijd handig om eerst even te bedenken waarom je de plugin maakt. Zoals ik al eerder zij ben ik af en toe een beetje lui en dingen doen om het dingen doen gaat mij te ver dus voordat we gaan beginnen moeten we weten waarom we beginnen. Een kleine plugin die ik een hele tijd geleden heb gemaakt is de mogelijkheid om bootstrap toe te voegen aan je WordPress site.

Als programmeur ben ik zelf niet zo van alle drag en drop builders die de html en css voor je maken ik vind het zelf veel makkelijker om gewoon direct de HTML te schrijven met bootstrap classes. Daarom gebruik ik op bijna alle sites wel bootstrap en heb ik een mini plugin geschreven die bootstrap functionaliteit toevoegd aan de WordPress site.

Stap 1. Connectie naar je Server

Het allereerste wat we nodig hebben is een verbinding naar de server waar je WordPress Site gehost is. Dit kan je met een FTP programma doen of als je een programmeur bent zit deze optie vaak al in je ontwikkelomgeving. ZORG er wel voor dat je verbinding maakt via SFTP dit is de beveiligde variant. Zodra je verbonden bent ga dan naar de map met de plugins deze map bevindt zich staandaard in /wp-content/plugins/.

Stap 2. Maak een nieuwe map aan voor je plugin

Als je in de plugins directory bent maak dan een nieuwe naam aan voor je plugin. Wees zorgvuldig met je naamgeving en zorg ervoor dat je naamgeving een beetje omschrijvend is. Niemand weet nog het verschil tussen plugin_1 en plugin_2 als je er na een maand weer verder aan moet werken. Als je je directory hebt aangemaakt gaan we daarin onze plugin file aanmaken. De gangbare conventie is dat je file van waaruit je plugin begint dezelfde naam geeft als je plugin directory. Dus we gaan een file aanmaken genaamd fourbis-add-bootstrap-files.php

Stap 3. Voeg de Plugin Informatie toe

Elke plugin heeft een speciaal blok code dat WordPress uitleest en ervoor zorgt dat WordPress jouw plugin herkent als plugin.

Gefeliciteerd je hebt zojuist alles toegevoegd om een plugin te maken. Je kan nu je plugin activeren in het admin gedeelte van je site. Enige nadeel is je plugin doet nog niks dus we moeten nu wat functionaliteit gaan toevoegen zodat onze plugin ook daadwerkelijk wat doet.

Stap 4. Functionaliteit

Tot hier was het allemaal makkelijk en nu begint het leuke werk functionaliteit ontwikkelen voor onze plugin. Onze plugin is nu net een onbeschreven boek, we kunnen nog alle kanten op! De makkelijkste manier om functionaliteit toe te voegen aan je plugin is met actions en filters. Actions en filter zijn hooks die in WordPress zitten waarop wij kunnen inhaken. Als er ergens in WordPress de code do_action(‘handmatigeActie’) wordt uitgevoerd dan kunnen we daarop inhaken met een add_action() method die pakt 2 parameters de eerste is de action waarop we willen inhaken en de 2e is de naam van de functie die we willen uitvoeren als WordPress die action uitvoert.

Wat wij willen doen is de bootstrap functionaliteit toevoegen aan onze website. Dit gebeurt door middel van het toevoegen van een stylesheet en een javascript file. We kunnen hier gebruik maken van de wp_enqueue_scripts action hook met deze hook kan je scripts en CSS stylesheets toevoegen aan je website.

Stap 5. Alles Samenvoegen

De Laatste stap is eigenlijk een kleine en dat is de functionaliteit die je net hebt geschreven toe te voegen aan je plugin file. Zodra je dat gedaan hebt dan is je plugin af. Natuurlijk is dit een heel makkelijk voorbeeld dat al helemaal is uitgekauwd maar dit was om te laten zien dat het begin van de plugin maken helemaal niet moeilijk is maar hoe meer functionaliteit je plugin moet kunnen hoe ingewikkelder je plugin wordt. Zo kunnen de wat grotere WordPress Plugins al snel over honderden files beschikken.

Dingen om te overwegen

De voorbeeld plugin is een heel makkelijk voorbeel en is een goede manier om vertrouwd te raken met het plugins ontwikkelen. Wil je zelf een beetje gaan experimenteren dan is er heel veel informatie te vinden op de WordPress Codex. Heb je na veel bloed zweet en tranen een goed werkende plugin dan wil je waarschijnlijk ook een options pagina om dingen op te kunnen configureren. Zo zijn er nog tal van andere zaken waar goed rekening gehouden mee moet worden bij het ontwikkelingsprocess.

Het maken van een WordPress plugin is een een goede manier om de beginselen te leren van hoe WordPress werkt. Heb je nou hulp nodig of ben je op zoek naar ervaren plugin bouwers voor WordPress neem dan contact op met ons ontwikkelings team.