Soms is het handiger om direct vanaf je eigen computer met WordPress te werken. Maar als je niet weet hoe je een lokale installatie van WordPress aanmaakt, vraag je je wellicht af of dat iets is wat je zelf kunt doen.

Het goede nieuws is dat je met een paar simpele stappen een lokale WordPress installatie kan maken. Of je nou nieuwe features wilt testen, wat wil experimenteren met projecten in ontwikkeling, of een WordPress website wil bouwen en vervolgens live wil pushen, een lokale WordPress installatie kan bij al deze dingen helpen.

In dit artikel delen we hoe je een lokale WordPress installatie kan aanmaken op Windows, Mac en Ubuntu/Linux door DevKinsta, DesktopServer, XAMPP, WAMP, of MAMP te gebruiken.

Aan de slag!

Een introductie over het lokaal installeren van WordPress

Hier bij Kinsta bieden we een testomgeving waar je makkelijk kunt ontwikkelen en testen. Een lokale installatie van WordPress heeft echt nog wat extra voordelen, bijvoorbeeld wanneer je aan het reizen bent en geen toegang hebt tot wifi. In dat geval kun je een lokale installatie gebruiken om toch door te werken.

Daarnaast is een lokale installatie soms sneller bij het doen van lokale bewerkingen of het verplaatsen van bestanden. En gelukkig kost het meestal maar weinig moeite om ermee aan de slag te gaan.

Wanneer je een lokale installatie van WordPress wilt maken, heb je een lokale AMP stack nodig op je computer. In het geval van WordPress staat AMP voor Apache, MySQL en PHP. Dit zijn de technieken die je nodig hebt om te repliceren wat een managed WordPress hostingprovider voor je zou uitvoeren op een webserver.

Je kan verschillende methoden gebruiken om deze stack te maken. De meest gebruikelijke opties gebruiken WAMP, XAMPP en MAMP. Dit zijn bijzonder handige tools, en we zullen ze allemaal toelichten.

Maar ze zijn tegelijkertijd wel ontworpen om ook samen te werken met allerlei andere tools en toepassingen. Het kan dus wat lastiger zijn om ermee te werken als je er net mee begint. Daarom beginnen we met het uitleggen van het gebruiksvriendelijke platform DesktopServer, dat specifiek is ontworpen en geoptimaliseerd om met WordPress te werken als een lokale AMP stack.

Zo installeer je WordPress lokaal met DevKinsta

DevKinsta is Kinsta’s eigen lokale ontwikkelingstool voor WordPress. Met DevKinsta kun je met één klik lokale WordPress sites maken. DevKinsta wordt geleverd met geavanceerde tools voor database- en e-mailbeheer en volledige integratie met MyKinsta.

Het beste van alles is dat DevKinsta volledig gratis is!

DevKinsta
DevKinsta

Voordat we uitleggen hoe je DevKinsta installeert, zijn hier een paar belangrijke features die je moet weten:

  • Met één klik WordPress sites aanmaken, inclusief ondersteuning voor Multisite en WP-CLI.
  • Een moderne stack aangedreven door Nginx, MySQL en de nieuwste versie van PHP.
  • MyKinsta integratie – importeer door Kinsta gehoste sites en push wijzigingen naar Kinsta.
  • Databasebeheer met Adminer.
  • SMTP server en een tool om e-mails te ontvangen voor het inspecteren van uitgaande e-mails.

DevKinsta is beschikbaar als gratis download voor macOS en Windows, in de toekomst volgt ook Linux (Ubuntu).

Laten we eens kijken hoe je DevKinsta op je computer kan opzetten.

Stap 2: DevKinsta downloaden en installeren

Download hier de nieuwste versie van DevKinsta om te beginnen.

  • Om DevKinsta op macOS te installeren, open je het DMG bestand en sleep je de DevKinsta app naar je map “Applications”. Dubbelklik nu op DevKinsta in je map “Applications”.
  • Om DevKinsta op Windows te installeren, dubbelklik je op het uitvoerbare bestand en doorloop je de installatiewizard.
  • Om DevKinsta op Ubuntu te installeren, download het .deb pakket en installeer het. Dit kan gedaan worden op de command-line, of met het installatieprogramma van uw voorkeur.

Wanneer je DevKinsta voor de eerste keer start, wordt Docker Desktop als een dependency geïnstalleerd. DevKinsta gebruikt Docker Desktop voor het maken van gecontaineriseerde WordPress omgevingen.

Tijdens het installatieproces van DevKinsta kun je een pop-upbericht te zien krijgen met de tekst “Docker Desktop needs privileged access.” Als je dat bericht ziet, klik je op “Okay” en geef je het wachtwoord van je gebruikersaccount op zodat Docker Desktop correct kan worden geïnstalleerd.

Nadat je het wachtwoord voor de installatie hebt opgegeven, zal DevKinsta Docker Desktop samen met enkele Docker images installeren. De installatie kan enige tijd duren, afhankelijk van de snelheid van je internetverbinding, dus voel je vrij om even een kopje koffie te zetten.

Zo maak je met DevKinsta een lokale WordPress site aan

DevKinsta ondersteunt drie methoden voor het maken van lokale WordPress sites.

  1. Nieuwe WordPress site waarmee een lokale site kan maken met de standaard hostingstack die bestaat uit Nginx, MySQL, PHP 7.4 en de nieuwste versie van WordPress.
  2. Importeren vanuit Kinsta waarmee je met slechts een aantal klikken een op Kinsta gehoste site kan klonen naar je lokale computer. Nadat je klaar bent met werken, kan je zelfs wijzigingen terugzetten naar een Kisnta staging-omgeving!
  3. Custom site waarmee je een lokale site kan maken met een custom hostingstack. Met deze optie kan je zelf de PHP versie kiezen, de naam van je database specificeren en WordPress Multisite inschakelen.
DevKinsta heeft drie methoden om lokale WordPress sites te maken.
DevKinsta heeft drie methoden om lokale WordPress sites te maken.

Laten we elke methode voor het maken van sites eens beter bekijken.

Nieuwe WordPress site

Selecteer om te beginnen de optie voor nieuwe WordPress site. Voor deze methode voor het maken van een site hoef je alleen maar een sitenaam, gebruikersnaam voor je WordPress admin en een wachtwoord voor je WordPress admin op te geven. Nadat je deze drie velden hebt ingevuld, klik je op “Create Site”.

Een nieuwe WordPress site maken in DevKinsta.
Een nieuwe WordPress site maken in DevKinsta.

Importeren vanuit Kinsta

De twee optie is om een site-omgeving die al op Kinsta wordt gehost te importeren. Om dit te doen, klik je op “Import from Kinsta” en geef je je MyKinsta inloggegevens op.

Selecteer, nadat je bent ingelogd, de Kinsta omgeving die je naar je lokale computer wil klonen. DevKinsta ondersteunt zowel live- als staging-omgevingen van Kinsta, dus zorg ervoor dat je de juiste kiest.

Nadat je op een omgeving hebt geklikt, geef je aan of de site een installatie op meerdere locaties is en klikt u op “Import Site” om je site te klonen.

Kloon je live site met de functie "Import from Kinsta".
Kloon je live site met de functie “Import from Kinsta”.

Custom Site

Met de derde en laatste optie, “Custom site”, kan je specifieke instellingen configureren voor je lokale WordPress installatie.

Hier zijn de instellingen die je kan aanpassen met deze methode:

  • Naam site
  • PHP versie (PHP 7.2, 7.3, 7.4 en 8.0)
  • Naam database
  • HTTPS inschakelen
  • Titel WordPress site
  • E-mail WordPress admin
  • Gebruikersnaam WordPress admin
  • Wachtwoord WordPress admin
  • WordPress Multisite modus
Een lokale WordPress installatie aanpassen met DevKinsta.
Een lokale WordPress installatie aanpassen met DevKinsta.

Nadat je de gewenste instellingen hebt geconfigureerd, klik je op “Create site” om te beginnen met het aanmaken van de site.

Navigeren door het “Site Info” scherm van DevKinsta

Nadat je een site hebt aangemaakt, zie je het “Site Info” scherm. Elke site die je met Kinsta maakt, heeft zijn eigen “Site Info” pagina. Deze kan je beschouwen als een cruciaal dashboard voor een lokale WordPress site.

Op dit scherm vind je nuttige informatie, zoals identiteitsgegevens van de site, PHP versie, WordPress versie, SSL modus, inloggegevens database, hostnaam van de site.

Het scherm “Site Info” heeft handige knoppen om je lokale site in een webbrowser te openen, een site naar een Kinsta staging-omgeving te pushen, Adminer te starten voor databasebeheer en toegang te krijgen tot het WordPress admindashboard van je lokale WordPress installatie.

Laten we de belangrijkste aspecten van elk gedeelte van het “Site Info” scherm doornemen.

Het "Site Info" scherm in DevKinsta.
Het “Site Info” scherm in DevKinsta.

Aan de bovenkant van het “Site Info” scherm vind je algemene informatie over je WordPress site. Voor ontwikkelaars zijn vooral “Site Path” en “Site Host” handig. “Site Path” verwijst naar de locatie van de WordPress installatie binnen het lokale bestandssysteem en je kan op het mappictogram klikken om rechtstreeks naar de map te gaan en thema’s, plugins en meer te bewerken. De “Site Host” is een aangepaste .local domeinnaam (bijv. https://kinstalife.local) die je kan gebruiken om toegang te krijgen tot een lokale WordPress site in een webbrowser.

De sectie “SSL and HTTPS” bevat een HTTPS schakelaar, die automatissch een SSL certificaat genereert voor je lokale WordPress site en waarmee je via HTTPS toegang kan krijgen tot de site.

De “Database” sectie toont de database-instellingen voor je lokale WordPress site. Je hebt deze informatie nodig om toegang te krijgen tot je WordPress data via de MySQL commandline-tool of een externe databasebeheertool.

Ten slotte toont de sectie “WordPress” de versie van je WordPress core, de status van de Multisite modus en is er zelfs een schakelaar om de WP_DEBUG modus in te schakelen om problemen met je WordPress site op te lossen.

Meerdere sites beheren in DevKinsta

Voor bureaus en ontwikkelaars die aan meerdere projecten tegelijk werken, hebben we goed nieuws. Met DevKinsta kan je heel eenvoudig meerdere lokale WordPress sites uitzetten en beheren! Elke lokale WordPress site die door DevKinsta wordt beheerd, heeft zijn eigen gecontaineriseerde omgeving. Dit betekent ook dat elke site zijn eigen custom PHP versie, WordPress versie, e-mailinbox en meer heeft.

Om je devKinsta sitelijst te bekijken, klik je op het sitepictogram in de linkerzijbalk.

Meerdere lokale WordPress omgevingen uitzetten met DevKinsta.
Meerdere lokale WordPress omgevingen uitzetten met DevKinsta.

Op dit scherm zie je een lijst met al je lokale WordPress sites. Om nog een site toe te voegen, klik je op de knop “Add Site”.

Meerdere lokale WordPress sites beheren met DevKinsta.
Meerdere lokale WordPress sites beheren met DevKinsta.

MyKinsta integratie in DevKinsta

Voor gebruikers met WordPress sites die op Kinsta worden gehost, maakt DevKinsta het gemakkelijk om wijzigingen online te pushen naar een Kinsta staging-omgeving. Om een lokale site naar Kinsta te pushen, hoef je alleen maar op de knop “Push to Staging” te klikken op je “Site Info” pagina.

Push je lokale WordPress site naar een Kinsta staging-omgeving.
Push je lokale WordPress site naar een Kinsta staging-omgeving.

Indien nodig word je gevraagd om je MyKinsta inloggegevens op te geven.

Vervolgens moet je een doelsite selecteren waar je de site naartoe wil pushen. Houd er rekening mee dat dit proces de inhoud van de huidige staging-omgeving zal overschrijven als die bestaat.

Kies een staging-omgeving om wijzigingen naar te pushen.
Kies een staging-omgeving om wijzigingen naar te pushen.

Klik ten slotte op “Push to Staging” om de actie te bevestigen.

Bevestig de actie "Push to Staging".
Bevestig de actie “Push to Staging”.

Nadat je je lokale WordPress site naar Kinsta hebt gepusht, kan je de site bekijken via de URL van de staging-omgeving. Indien nodig kan je de staging naar live pushen in MyKinsta.

Zo gebruik je Adminer om je database te beheren

DevKinsta wordt geleverd met een lichtgewicht databasebeheertool genaamd Adminer. Net als phpMYAdmin, die we gebruiken voor sites die worden gehost op Kinsta, geeft Adminer je een webinterface om databasetabellen te bewerken, databasequery’s uit te voeren, back-ups te importeren en meer.

Om Adminer te start klik je op de “Database Manager” knop bovenaan de pagina “Site Info”. Adminer wordt vervolgens geopend in je standaardwebbrowser.

Klik op "Database Manager" om Adminer te openen in DevKinsta.
Klik op “Database Manager” om Adminer te openen in DevKinsta.

Nadat je Adminer hebt gestart, zie je de tabellen van je WordPress database. De onderstaande screenshot toont de database van onze testsite “kinstalife”. Onder de kolom “Table” kan je de standaard WordPress tabellen zien als wp_comments, wp_posts, etc.

WordPress database in Adminer.
WordPress database in Adminer.

Om een database-item te bewerken moet je op de bijbehorende tabel klikken. Als we bijvoorbeeld de homepage en site URL van onze WordPress site willen wijzigen, kunnen we op de tabel wp_options klikken.

Klik op "Select Data" om je WordPress databasetabellen te bewerken.
Klik op “Select Data” om je WordPress databasetabellen te bewerken.

Op deze pagina kunnen we de option_value voor siteurl bewerken om zo de site URL van onze WordPress site te updaten. Hetzelfde geldt voor de home URL.

Een WordPress database "option_value" bewerken met Adminer.
Een WordPress database “option_value” bewerken met Adminer.

Adminer ondersteunt ook het importeren en exporteren van databases. Dit is handig voor het werken met back-upbestanden van de database, zoals de bestanden die we in de downloadbare back-ups opnemen.

Om een databasebestand te importerne, klik je op “Import” in de linkerbovenhoek van Adminer. Klik op “Choose Files” om een databaseback-up te selecteren en klik op “Execute” om het importproces te starten. Adminer ondersteunt zowel onbewerkte .sql bestanden als gecomprimeerde .sql.gz bestanden.

Importeer een databasebackup met Adminer.
Importeer een databaseback-up met Adminer.

Om een volledige databaseback-up te exporteren, klik je op “Export” in de linkerbovenhoek van Adminer. Selecteer “gzip” als outputformat, “SQL” als databaseformat en laat de andere instellingen ongewijzigd. Klik “Export” om het back-upproces te starten.

Adminer exporteert vervolgens je WordPress database naar een gecomprimeerd .sql.gz bestand.

Exporteer een databasebackup van Adminer.
Exporteer een databaseback-up van Adminer.

Ten slotte ondersteunt Adminer het uitvoeren van SQL opdrachten, wat betekent dat je databasequery’s op je WordPress database kunt uitvoeren. Zo kan je met onderstaand SQL commando in Adminer bijvoorbeeld de hoeveelheid autoloaded data vinden in je database.

SELECT SUM(LENGTH(option_value)) as autoload_size FROM wp_options WHERE autoload='yes';

Om een databasequery uit te voeren, klik je op “SQL Command” in de linkerbovenhoek van Adminer. Specificeer een databasequery en klik op “Execute” om de opdracht uit te voeren.

Databasequery met een SQL commando in Adminer.
Databasequery met een SQL commando in Adminer.

Met de Adminer integratie van DevKinsta heb je uitgebreide controle over je WordPress database.

Of je nu databasetabellen moet bewerken, back-ups moet importeren of exporteren of complexe SQL opdrachten moet uitvoeren, DevKinsta staat voor je klaar!

Uitgaande e-mails van WordPress inspecteren

DevKinsta bevat een ingebouwde SMTP server en tool voor het ontvangen van e-mails. Hiermee kunnen je lokale WordPress sites versturen, net als een live productiesite. Verzonden e-mails worden echter vastgelegd en opgeslagen in de e-mailinbox van DevKinsta.

Hiermee vang je twee vliegen in één klap – je kan DevKinsta gebruiken om uitgaande e-mailfunctionaliteit te testen voor marketingautomatiseringsworkflows, WooCommerce orderbevestigingen en meer, zonder dat je de inboxen van je bezoekers en klanten hoeft te spammen.

Om toegang te krijgen tot de e-mailinbox van DevKinsta, klik je op het e-mailpictogram in de linkerzijbalk.

DevKinsta bevat een ingebouwde SMTP server en tool voor het ontvangen van e-mails.
DevKinsta bevat een ingebouwde SMTP server en tool voor het ontvangen van e-mails.

In de inbox zie je een lijst met uitgaande e-mails die zijn vastgelegd. In de onderstaande screenshot zie je een uitgaande e-mail van onze testsite “kinstalife”.

Een uitgaande e-mail in de inbox van DevKinsta.
Een uitgaande e-mail in de inbox van DevKinsta.

Om een uitgaande e-mail te bekijken, klik je erop. Voor elke e-mail laat DevKinsta je het “van adres”, “naar adres”, de inhoud van de body, het tijdstip van levering en meer inspecteren.

DevKinsta e-mailinbox weergavemodi.
DevKinsta e-mailinbox weergavemodi.

Je kan er ook voor kiezen om de e-mail weer te geven in HTML, Plain Text of Raw mode. De HTML modus is handig voor het testen van HTML e-mailtemplates, terwijl je met de Raw modus e-mailheaders zoals MIME-Version en X-Mailer rechtstreeks kunt inspecteren.

Wil je meer leren over DevKinsta, zorg er dan voor dat je lid wordt van ons officiële communityforum en lees de DevKinsta documentatie.

Zo maak je een lokale WordPress installatie op Windows met WAMP

Wil je WordPress lokaal installeren op een Windows computer, dan kun je dit ook doen via WampServer, ook bekend als WAMP. WAMP is een toepassing die Apache webserver, PHP en MySQL bundelt speciaal voor Windows apparaten. Laten we kijken hoe je het kunt gebruiken om WordPress lokaal te installeren.

Stap 1: Download en installeer WAMP op je computer

De eerste stap is het downloaden en installeren van WAMP op je computer. Dit doe je door naar de WampServer website te gaan en te klikken op Start Using WampServer:

De WampServer website
De WampServer website

Hierdoor ga je automatisch naar de downloads van de site, waar je uit twee opties kunt kiezen: WampServer 32 bit en WampServer 64 bit. Selecteer wat het beste past bij je besturingssysteem.

Weet je niet zeker of je een 32 of 64 bits OS hebt, dan kun je dit vinden bij Settings > About:

De eigenschappenpagina op Windows
De eigenschappenpagina op Windows

Onder Device specifications zul je het aantal bits zien van jouw besturingssysteem.

Stap 2: Voer het Wampserver.exe bestand uit om de installatie te starten

Na het downloaden van de software klik je op het wampserver.exe bestand om de installer te starten. Dit kan een minuut of twee duren.

Let op waar het bestand gedownload wordt, aangezien je het later moet gebruiken:

Het setup venster van Wamp
Het setup venster van Wamp

Je zult een aantal vensters met instructies krijgen om de installatie uit te voeren.

Tijdens dit proces moet je ook een voorkeursbrowser aangeven. Je kan dit altijd veranderen via Program Files bij je computer.

Stap 3: Maak een nieuwe MySQL database

De volgende stap is het instellen van een lege MySQL database. Nadat je WAMP start, zal er een groen icoon verschijnen rechtsonder in je scherm.

Klik op dit icoontje, en vervolgens op phpMyAdmin. Hierdoor ga je automatisch naar het inlogscherm in je browser.

De phpMyAdmin login pagina
De phpMyAdmin login pagina

Bij gebruikersnaam kun je “root” intypen, laat het wachtwoordveld leeg, en druk op de Go knop. Klik vervolgens op Databases:

De Databases pagina van phpMyAdmin
De Databases pagina van phpMyAdmin

Onder het deel Create Databases kun je een naam voor je nieuwe database kiezen. Klik vervolgens op Create. En klaar alweer. Je database is nu ingesteld.

Stap 4: Installeer WordPress en pak het bestand uit

Na het aanmaken van je database is de volgende stap het lokaal installeren van WordPress. Om dit te doen ga je naar WordPress.org en klik je op Get WordPress, en vervolgens op Download WordPress:

De downloadpagina op WordPress.org
De downloadpagina op WordPress.org

Hierdoor zul je een .zip bestand downloaden op je computer. De volgende stap is het uitpakken van dit bestand. Klik op de gedownloade map en selecteer Extract all.

Daarna rechtsklik je op de map en selecteer je Copy. Ga terug naar de map op je computer waar je WAMP hebt gedownload en plak de “wordpress” map in die map.

Op dit moment kun je de “wordpress” map ook een andere naam geven als je dat handiger vindt. De naam van de map zal namelijk de URL van je lokale WordPress installatie worden. Voor deze tutorial zullen we onze maps “mytestsite” noemen.

Stap 5: Bezoek je lokale WordPress website in je browser

Open je webbrowser en typ “http://localhost/mytestsite/” in bij de adresbalk. Je vervangt “mytestsite” natuurlijk door de naam van de “wordpress” map.

De software zal je een aantal vragen stellen voor het instellen van je WordPress installatie. Je kan een taal kiezen en de database informatie controleren (dezelfde stappen die we in het vorige gedeelte hebben beschreven). Daarna klik je op Let’s go!:

De pagina met details over de database van een nieuwe WordPress installatie
De pagina met details over de database van een nieuwe WordPress installatie

Op het volgende scherm vul je de informatie over de database in. Deze naam zal de naam van je database zijn, de gebruikersnaam is “root” en je kunt het wachtwoordveld weer leeg laten.

Vervolgens klik je op Run the installation. Daarna geef je je website een naam en maak je een gebruikersnaam en wachtwoord aan. Als je dat gedaan hebt selecteer je Install WordPress. Wanneer de software geïnstalleerd is, krijg je een melding met Success!

Daarna klik je op Log in. Hierdoor ga je naar de admin inlogpagina van je WordPress website.

Klaar! Je hebt nu een lokale testomgeving geïnstalleerd.

Zo maak je een lokale WordPress installatie op een Mac met MAMP

Ben je op zoek naar lokale serversoftware voor een Mac computer, dan is MAMP het overwegen waard. MAMP staat voor MacIntosh, Apache, MySQL en PHP. Het is bijzonder gebruiksvriendelijk en eenvoudig.

Stap 1: Download en installeer MAMP op je computer

Net als bij de vorige twee secties, is de eerste stap het downloaden en installeren van MAMP op je computer. Dit doe je vanaf de officiële MAMP website.

Het MAMP downloadvenster
Het MAMP downloadvenster

Het is goed om te weten dat je MAMP gratis kunt downloaden en gebruiken, maar dat er ook premium pakketten aangeboden worden.

Stap 2: Start MAMP en start je servers

Na het downloaden klik je op het bestand mamp.pkg. Je zult dan een installatievenster zien. Klik op Continue om een aantal vensters bij langs te gaan:

Het MAMP installatie venster
Het MAMP installatie venster

Ga vervolgens naar Go > Applications op je computer en klik op de MAMP map:

De MAMP map
De MAMP map

Binnen de map klik je op het icoontje van MAMP (een olifant):

Het MAMP icoon
Het MAMP icoon

Dit zal een nieuw venster openen. Klik op Start Servers:

De MAMP optie voor start servers
De MAMP optie voor start servers

Nadat de Apache en MySQL servers draaien, zal MAMP automatisch een WebStart pagina in je browser openen.

Stap 3: Maak je database aan en voeg gebruikersinformatie toe

Nu ga je een database maken. Op de WebStart pagina klik je op Tools > phpMyAdmin:

Openen van phpMyAdmin via de MAMP WebStart pagina
Openen van phpMyAdmin via de MAMP WebStart pagina

Nadat phpMyAdmins open is, klik je op het tabblad Databases. Geef je database een naam en selecteer Create:

Maak een nieuwe database voor je lokale MAMP site
Maak een nieuwe database voor je lokale MAMP site

Daarna zul je de gegevens van je MySQL database moeten toevoegen voor het standaardaccount dat MAMP voor je aanmaakt, aangezien je die nodig hebt om het installeren van WordPress af te ronden. Ga terug naar het startscherm van phpMyAdmin en klik op het tabblad User Accounts.

Klik daar op Edit privileges voor het account met de gebruikersnaam mamp:

Bewerken van het standaard MAMP phpMyAdmin gebruikersaccount
Bewerken van het standaard MAMP phpMyAdmin gebruikersaccount

Selecteer het tabblad Change password, voeg een wachtwoord toe en klik op Go:

Veranderen van het standaardwachtwoord van MAMP phpMyAdmin
Veranderen van het standaardwachtwoord van MAMP phpMyAdmin

Nu kun je phpMyAdmin afsluiten.

Stap 4: Installeer WordPress en bezoek je site vanuit de localhost

Nu kun je naar de WordPress.org website gaan en de laatste versie van WordPress downloaden. Pak vervolgens de “wordpress” map uit. Rechtsklik op de map en selecteer Copy.

Ga terug naar Go > Applications > MAMP op je computer en open de map htdocs:

De map htdocs in MAMP
De map htdocs in MAMP

Binnen die map plak je de WordPress map die je net hebt gekopieerd. Je kan die map het beste een andere naam geven, zoals “mytestsite” of iets in die richting.

De lokale WordPress installatie van MAMP een nieuwe naam geven
De lokale WordPress installatie van MAMP een nieuwe naam geven

Ga vervolgens in een nieuw tabblad naar “http://localhost/8888/mytestsite”. Je zal gevraagd wordt om je database gegevens in te voeren, en je website een naam te geven:

Afronden van de WordPress installatie wizard
Afronden van de WordPress installatie wizard

Nadat je alle WordPress installatievragen hebt afgewerkt, ben je helemaal klaar! Heb je nog meer instructies nodig voor deze stap, dan kun je ook even in het vorige gedeelte van dit artikel kijken.

U kunt hier onze handleiding lezen over hoe u de foutmelding “This Site Can’t Provide a Secure Connection” kunt oplossen wanneer u MAMP gebruikt.

Zo maak je een lokale WordPress installatie met XAMPP

XAMPP is nog een andere populaire PHP development omgeving waarin je WordPress lokaal kunt installeren. Je kan het gebruiken voor zowel Windows, macOS als Linux. We zullen het voordoen voor Windows, maar voor Mac gebruikers is het bijna hetzelfde.

Stap 1: Download en installeer XAMPP op je computer

Ga naar de Apache Friends website, en klik naast de groene knop Download op XAMPP for Windows (of het besturingssysteem dat je gebruikt):

De Apache Friends website
De Apache Friends website

De software zal automatisch gedownload worden. Daarna klik je op het .exe bestand om de installer te starten.

Voor macOS zal dit een .dmg bestand zijn. Na het openen klik je op het XAMPP icoontje en sleep je dat naar je map Applications.

Stap 2: Kies de componenten die je wilt installeren

Na de installer te starten zal je gevraagd worden welke componenten je wilt installeren. De belangrijkste hierbij zijn Apache, MySQL, PHP, en phpMyAdmin:

Het scherm voor componenten van XAMPP
Het scherm voor componenten van XAMPP

Je kan eventueel de andere componenten uitzetten, aangezien die niet nodig zijn. Als je klaar bent, klik je op Next en selecteer je de map waar je XAMPP wil installeren.

Klik weer op Next, negeer de Bitnami prompt en klik nog eens op Next.

Stap 3: Start het XAMPP Control Panel en test je server

Op het laatste scherm kies je voor het starten van het XAMPP Control Panel. Binnen het XAMPP Control Panel dat opent, klik je op de Start knoppen naar zowel Apache als MySQL:

Het XAMPP Control Panel
Het XAMPP Control Panel

Na het starten, zou de status groen moeten worden. Nu kun je de server testen. Dit doe je door “http://localhost/” in te voeren in je webbrowser. Als het werkt, is het gelukt om XAMPP te installeren op je computer.

Stap 4: Download WordPress en maak een database

De volgende stap is het installeren van WordPress op je computer. Dit doe je door naar WordPress.org gaan en te klikken op Get WordPress.

Na het downloaden pak je de bestanden uit en kopieer je de map. Ga vervolgens naar de XAMPP map op je computer, en open de htdocs map.

Vervolgens maak je binnen de htdocs map een nieuw map aan. Deze kun je bijvoorbeeld “mytestsite” noemen. Binnen die map kun je de WordPress bestanden plakken.

Nu ga je een database maken.

Ga terug naar het XAMPP controlepaneel en selecteer Admin naast MySQL. Hierdoor zal phpMyAdmin starten.

Klik op Databases, geef je database een naam en klik op Create (je kan de vorige gedeelten in dit artikel zien voor meer uitleg).

Je kan de database een naam geven die je zelf wilt. Maar we raden je aan om alles simpel te houden, denk aan “test_db”.

Stap 5: Installeer WordPress lokaal door naar je website te gaan binnen je browser.

Om het proces af te ronden ga je naar “http://localhost/mytestsite” in je browser. Vergeet niet “mytestsite” te vervangen met de naam van jouw WordPress map.

Je zult een taal en naam kunnen kiezen, en de gegevens van je database invullen. Vervolgens kun je inloggen op je WordPress website en je lokale omgeving gaan gebruiken.

Zo maak je een lokale WordPress installatie met DesktopServer

DesktopServer was een geweldig WordPress product door ServerPress, die het lokaal installeren van WordPress enorm vereenvoudigde:

Het DesktopServer scherm
Het DesktopServer scherm

Je kan een nieuwe installatie voor ontwikkelingsdoeleinden binnen een paar seconden aanmaken door simpelweg op een knopje te klikken. De tool biedt ook volledige ondersteuning voor multisite en WP-CLI, en werkt zowel op Windows als Mac.

ServerPress had zowel een gratis versie als een premium versie, de laatste kostte $99,95 per jaar. De premium versie bevatte een paar geavanceerde mogelijkheden, zoals:

  • Multi-pagina ondersteuning
  • Importeren en exporteren van externe back-ups
  • Direct uitrollen naar je live site
  • Omzeilen van inlogplugins

Je kon kiezen welke versie het beste bij je past, afhankelijk van je behoeften. Als je alleen snel wat testen moest doen, werkte de gratis versie goed.

Stap 1: Download DesktopServer

Om WordPress lokaal te installeren moet je eerst al een kopie van DesktopServer op je machine geïnstalleerd hebben.

Er was zowel een Windows versie als een Mac versie. Voor dit voorbeeld gebruiken we de Windows versie.

 

Stap 2: Start de DesktopServer installer

Nadat het bestand gedownload is, kun je de DesktopServer installer starten. Hiervoor moet je wel eerst het bestand dat je net gedownload hebt uitpakken. Dat kan een paar minuten duren.

Nadat dit gelukt is, klik je op Install DSL:

De DesktopServer Installer toepassing
De DesktopServer Installer toepassing

Wanneer je het programma voor de eerste keer start, zul je de vraag kijken om opnieuw te starten als admin. Selecteer Continue. Vervolgens word je gevraagd de algemene voorwaarden te accepteren, en een optie voor je installatie te kiezen:

Het DesktopServer Installation venster
Het DesktopServer Installation venster

Laat de optie New Desktop Installation aangevinkt, en klik op Continue. Het installeren zal beginnen, wat even kan duren.

Nadat het gelukt is krijg je een pop-up om je te laten weten dat het klaar is. Die pop-up zal je ook laten zien waar op je computer de toepassing te vinden is. Wanneer alles klaar is, klik je op Finish.

Stap 3: Schakel de plugins in en start Apache en MySQL Services

Nadat het programma is geïnstalleerd, kun je verschillende plugins voor developers activeren:

Het DesktopServer developer plugins scherm
Het DesktopServer developer plugins scherm

Een kort overzicht van de developerplugins die je kan gebruiken bij een lokale WordPress installatie. We raden vooral de bypass login en DS-CLI plugins aan.

  • Airplane Mode: Beheer het laden van externe bestanden terwijl je lokaal een website maakt.
  • Bypass login: Maakt het mogelijk om als developer logins te omzeilen, via een snelle keuze uit de eerste 100 gebruikersnamen in een combobox.
  • Clean Import: Reset .htaccess, leegt de cache van externe hosts.
  • Debug and Trace: Dwingt WP_DEBUG = true af, en schakelt cross-platform/language trace statements in voor PHP en JavaScript.
  • Dreamweaver Support: Maakt het automatisch aanmaken van Dreamweaver projectbestanden mogelijk, en een WYSIWYG modus (wat je ziet is wat je krijgt) bij het werken aan templatebestanden en style.css.
  • DS-CLI: Dit is een verbeterde cross-platform command-line interface voor professionele developers. Hiermee kun je makkelijker CLI, Composer, Git en PHPUnit gebruiken. NodeJS en NPM zijn ook ingebouwd om de installatie van GRUNT, Gulp en andere Node afhankelijke bestanden mogelijk te maken.
  • DS-Deploy: Dit kun je gebruiken om een site van een lokale DesktopServer installatie naar een live server over te zetten.
  • InnoDB Autoconvert: Converteert de tabellen van een site om naar InnoDB bij Create, Copy, Move, en Import bewerkingen.
  • Local Admin Color Bar: Verandert de kleur van de adminbalk.
  • Mailbox Viewer: Maakt het mogelijk om snel offline maildeliveryservices te bekijken als developer.

Let op dat sommige van deze mogelijkheden alleen in de premium versie zitten. Wanneer je klaar bent, klik je op Next. Je zult dan gevraagd worden of je de web- en databaseservices wilt starten, dus klik weer op Next.

Stap 4: Maak een nieuwe development site

Na het inschakelen van de plugins en het starten van de web en database diensten, zal het volgende venster je de mogelijkheid geven voor het maken van een nieuwe site: Create a new development website:

De optie voor het aanmaken van een nieuwe development website in DesktopServer
De optie voor het aanmaken van een nieuwe development website in DesktopServer

Hier zal het programma daadwerkelijk WordPress voor je installeren. Je kan een naam kiezen voor je website, wat ook het lokale adres zal worden. Wij noemen die van ons “testsite”, dus onze development URL wordt “testsite.dev” op onze computer:

Het scherm voor het maken van een website naam in DesktopServer
Het scherm voor het maken van een website naam in DesktopServer

DesktopServer maakt het mogelijk om met verschillende blauwdrukken te werken, wat haast hetzelfde werkt als een template. Wij gebruiken een lege installatie.

DesktopServer gebruikt standaard de laatste versie van WordPress bij een nieuwe installatie. Dit betekent dat je niet hoeft na te denken over het handmatig downloaden en uitpakken vanaf de repository.

Standaard bevindt de root van de site zich in je map My Documents (Mijn documenten). Als je dat prima vindt, kun je het gewoon zo laten. Maar voor verbeterde organisatie hebben wij die van ons veranderd naar een map in de root van onze C: schijf, met de naam “wordpress”.

Wanneer je klaar bent, klik je op Create. Vervolgens zie je de URL van je lokale WordPress installatie. Klik daarop om de installatie af te ronden.

Stap 5: Installeer en configureer je WordPress website

Nadat je op de genoemde link hebt geklikt, zal je lokale WordPress website openen in een nieuw tabblad van de browser:

Een instellingenpagina van een nieuwe WordPress installatie
Een instellingenpagina van een nieuwe WordPress installatie

Nadat je de taal kiest, geef je in de volgende stap een titel aan je website en kies je een gebruikersnaam (ga je deze website later live gebruiken, kies dan niet “admin”, waarom kun je lezen in onze gids over beveiliging van WordPress), een sterk wachtwoord en je emailadres:

Welkomstpagina van een nieuwe WordPress website
Welkomstpagina van een nieuwe WordPress website

Wanneer je klaar bent, klik je op Install WordPress. Klaar! Je hebt nu een lokale installatie van WordPress, en je website werkt normaal. Je kan nu naar je lokale installatie browsen en alles testen wat je wilt.

In ons geval gaan we binnen de adresbalk naar “testsite.dev”. Aangezien we de bypass login plugin hebben geactiveerd, is er een dropdown-menu waarin we onze admin kunnen selecteren, en worden we automatisch ingelogd. Natuurlijk gebruik je dit niet in een normale productiewebsite, maar voor een dev-omgeving is het superhandig.

Extra tips voor DesktopServer bij een lokale WordPress installatie

Vanwege de manier waarop Windows bestandsrechten beheert, kun je al dan niet een bericht zien tijdens het inloggen dat WordPress niet kan updaten:

Een bericht dat de WordPress update mislukt is
Een bericht dat de WordPress update mislukt is

Dit los je op door de command prompt te openen als admin, en de volgende opdracht uit te voeren binnen je WordPress map:

attrib -s *.*
LAMP permissies voor WordPress
LAMP permissies voor WordPress

Heb je meer uitleg of hulp nodig hoe je dit doet, lees dan meer op de site van ServerPress.

Voor het maken of bewerken van extra WordPress websites, kun je gewoon het DesktopServer.exe bestand opnieuw uitvoeren. Je kan diensten starten en stoppen, nieuwe sites maken, bewerken, importeren en exporteren, etc. Om toegang te krijgen tot phpMyAdmin, kun je op de knop Sites linksonder klikken:

De knop 'Sites' in DesktopServer
De knop ‘Sites’ in DesktopServer

Je kan ook “localhost” intypen in de adresbalk van je browser. Hierdoor krijg je de admininterface te zien op de localhost:

De administrator interface van de DesktopServer localhost
De administrator interface van de DesktopServer localhost

Daar krijg je links naar alle WordPress websites, dashboards en phpMyAdmin.

Nog een mooie feature is de mogelijkheid om met één klik WP-CLI (of DS-CLI) te starten. Wanneer je de DS-CLI optie hebt geselecteerd bij het instellen, zal er een link voor te vinden zijn binnen je dashboard. Als je daarop klikt kun je meteen beginnen met het uitvoeren van WP-CLI opdrachten.

DesktopServer heeft ook een exportfunctie, waarmee je de WordPress website direct naar een live site of .zip bestand kan exporteren. Je hebt daar wel de premium versie voor nodig.

Samenvatting

Door een lokale WordPress omgeving op te zetten kun je nieuwe features testen en je WordPress website ontwikkelen, tot je klaar bent om ze live te zetten. Er zijn verschillende manieren waarop je WordPress lokaal kan installeren op je computer.

In dit artikel hebben we uitgelegd hoe je dit kunt doen op zowel een Mac als Windows via software voor een lokale server omgeving, zoals DevKinsta, DesktopServer, WAMP, MAMP of XAMPP. De specifieke instructies hangen af van de tool die je gebruikt, maar het proces is samen te vatten in vijf belangrijkste stappen:

  1. Download en installeer de software voor een lokale installatie op je computer.
  2. Open het bestand .exe / .dmg en start de installer.
  3. Maak een nieuwe MySQL database.
  4. Download de laatste versie van WordPress.
  5. Ga naar je testsite via je browser om het proces voor localhost af te ronden.
Brian Li

Brian gebruikt WordPress al meer dan 10 jaar en deelt zijn kennis graag met de community. In zijn vrije tijd speelt Brian graag piano en verkent hij Tokio met zijn camera. Kom in contact met Brian op zijn website brianli.com.