Hoe maak je een lokale WordPress site met behulp van XAMPP

, Author

Wil je WordPress leren zonder een domeinnaam en hosting te kopen? Wilt u WordPress op uw lokale computer installeren? Wilt u met uw website spelen zonder klanten te beïnvloeden?

In dat geval is dit artikel over het maken van een lokale WordPress website met behulp van XAMPP precies wat u nodig hebt.

XAMPP is gratis software die u op uw computer kunt installeren die een webserver nabootst, zodat u WordPress kunt uitvoeren. Hierdoor kunt u uw website op uw computer ontwerpen voordat u deze naar een live omgeving uploadt.

Voordat we in de ‘hoe maak ik een lokale WordPress site’ stappen, laten we begrijpen waarom we een lokale installatie zouden moeten maken.

Waarom een WordPress website lokaal opzetten?

Ik herinner me mijn vroege dagen als website ontwikkelaar.

Om een website te maken, zou de eerste stap zijn om een server op een lokale computer op te zetten. Als de website een database nodig had, zou mijn volgende stap zijn om die ook op te zetten.

In het kort, ik zou een ontwikkelomgeving op mijn lokale systeem moeten opzetten.

Voor dit, zou ik twee afzonderlijke toepassingen downloaden, de webserver toepassing, en de database. Elk heeft zijn eigen installatieprocedures en je moet ze onafhankelijk van elkaar uitvoeren om aan je website te kunnen werken. Voor je het weet ben je een paar uur bezig met het uitzoeken en opzetten van de omgeving, nog voordat je zelfs maar begonnen bent met het ontwikkelen van de website!

Wat lokaal ontwikkelen je toestaat is om er zeker van te zijn dat je vanaf dag één een werkend model van de website op de live server hebt. Het is een geweldige optie wanneer u de functionaliteit lokaal wilt testen voordat de wereld uw website te zien krijgt.

Leer WordPress zonder domein en hosting

Een andere reden om een lokale WordPress site te maken is als u begint.

Als u WordPress wilt leren, zou u normaal gesproken moeten investeren in een domeinnaam en hosting. Ja, er zijn ook gratis opties, zoals WordPress.com.

Maar stellen deze gratis opties u in staat om alle functies en functionaliteiten te benutten die WordPress.org te bieden heeft? Nee, dat doen ze niet!

Dus, als u WordPress wilt leren kennen zonder vooraf te investeren in een domein en hosting, is het zinvol om een lokale versie van uw site te maken.

Voor het geval dat u een WordPress website wilt maken na de aanschaf van een domeinnaam en hosting, zou dit artikel over Hoe maak ik een WordPress website moeten helpen.

Zoals u zich inmiddels wellicht heeft gerealiseerd, om een WordPress website lokaal te maken, moeten we een lokale server opzetten. Of in netwerk terminologie, moeten we een localhost opzetten.

Wat is Localhost?

Localhost verwijst naar uw computer en hoe u er toegang toe heeft.

De localhost wordt gebruikt om toegang te krijgen tot de netwerkdiensten, zoals directory, database, e-mail, bestanden, printers, die op de host draaien via de loopback netwerk interface.

Té technisch? Nou, laat me dit uitsplitsen.

Het loopback-mechanisme kan worden gebruikt om een netwerkdienst op een hostcomputer te draaien zonder dat daarvoor een fysieke (d.w.z., hardware) netwerkinterface, zoals een netwerkpoort of een socket, of zelfs een netwerkinterfacecontroller.

Een lokaal gemaakte WordPress-website kan bijvoorbeeld vanuit de browser worden benaderd via de URL ‘http://localhost’, zolang XAMPP of andere software Apache of lokale webserversoftware draait.

Zoals bij elke domeinnaam het geval is, heeft de localhost ook een IP-adres (Internet Protocol). De IP adressen lopen van 127.0.0.0 tot 127.255.255.255. Het loopback adres heeft echter een standaard IP van 127.0.0.1.

Typisch, wanneer u een IP adres gebruikt, probeert u verbinding te maken met een computer op afstand via het internet.

Bijv. wanneer u wpastra.com in een web browser typt, leidt het u naar Astra’s web server en Astra’s hoofd pagina.

Hoewel, met het loopback adres, roept u de localhost op, d.w.z., uw computer.

En, omwille van dit artikel, gaan we verder en zetten onze lokale server op met XAMPP.

Dat brengt ons bij het volgende onderwerp.

Wat is XAMPP?

Want we hebben wel behandeld wat localhost is, maar we hebben niet behandeld waarom we de localhost nodig hebben.

WordPress is geschreven met PHP (Hypertext Preprocessor). Net als WordPress is PHP ook open-source en is het een veelgebruikte programmeer- en scripttaal om dynamische en interactieve websites te maken.

En waar denkt u dat alle gegevens, zoals blogartikelen, productdetails, die op uw website worden getoond, worden opgeslagen? Dat is waar de MySQL database in beeld komt.

MySQL is een DBMS (Database Management System) dat door WordPress wordt gebruikt om al uw website informatie op te slaan en op te halen.

Opnieuw, net als WordPress en PHP, is ook MySQL open-source.

En voor het geval u zich afvraagt wat een open-source is.

Welnu, een open-source is software waarvan de broncode vrij beschikbaar wordt gesteld en die opnieuw mag worden gedistribueerd en aangepast om zo goed mogelijk aan uw wensen te voldoen.

En om PHP en MySQL te draaien, die op hun beurt nodig zijn om uw WordPress website te draaien, heeft u een webserver nodig.

Ja, u heeft het goed geraden.

Om uw lokale webserver te maken, moet u XAMPP installeren.

xampp homepage

Zoals hun website het stelt, is XAMPP een zeer populaire PHP ontwikkelomgeving.

Voor een newbie kan het opzetten van de Apache, PHP, en MySQL omgevingen afzonderlijk op je lokale computer overweldigend zijn. Dat is waar het gebruik van XAMPP helpt.

XAMPP is een volledig gratis en eenvoudig te installeren software pakket dat u helpt bij het opzetten van een lokale server omgeving.

U kunt de software downloaden voor Windows, Linux, en Mac.

In dit artikel, gaan we verder en installeren XAMPP zodat we de localhost kunnen gebruiken op zowel Windows als Mac.

Stap 1: Download en installeer XAMPP op uw lokale computer

XAMPP installeren op Windows

Bezoek de XAMPP website en klik op de ‘XAMPP voor Windows’. Een installatiebestand (EXE-bestand) wordt gedownload. Klik op het installatiebestand en volg de instructies.

xampp setup 2

U kunt de standaardinstellingen zoals in de onderstaande afbeelding laten staan.

xampp setup 3

U kunt zelf de map kiezen waarin u XAMPP wilt installeren.

xampp setup 4

De standaardinstelling voor het doelstation en de doelmap is “C:\xampp”.

xampp setup 5

En de standaardtaal is Engels.

xampp setup 6
xampp setup 7

Klik op ‘Volgende’ wanneer u bovenstaand venster ziet, waarin u wordt gevraagd ‘Klaar voor installatie’.

xampp setup 8

Het is ook mogelijk dat u via een beveiligingswaarschuwing wordt gevraagd om toegang te verlenen tot de installatie.

xampp setup 9

Klik op ‘Toegang toestaan’ om verder te gaan.

xampp setup 10

Dat is het! XAMPP is geïnstalleerd.

Als u op ‘Voltooien’ klikt, wordt het configuratiescherm geopend.

xampp instellingen

Het configuratiescherm stelt u in staat om de corresponderende services te ‘starten’ en ‘stoppen’.

Ga uw gang en klik op ‘Starten’ tegen Apache en MySQL.

xampp instellingen voor wordpress

Nu, om te controleren of de installatie succesvol is afgerond, typt u ‘http://localhost’ in uw webbrowser.

localhost succesvol geïnstalleerd

Na succesvolle installatie, zult u in staat zijn om toegang te krijgen tot de bovenstaande startpagina.

Nu we XAMPP lokaal op een Windows besturingssysteem hebben geïnstalleerd, laten we eens kijken naar de stappen die nodig zijn om XAMPP lokaal op de Mac te installeren.

Installeren van XAMPP op Mac

Hoewel de stappen min of meer gelijk zijn, zijn er toch een paar verschillen waar u rekening mee dient te houden.

Om te beginnen klikt u niet op het tabblad ‘XAMPP voor OS X’ op de startpagina, maar op de link ‘Klik hier voor andere versies’ onder ‘Download’.

Download xampp voor OS X 1

In sommige gevallen werkt het standaarddownloadbestand nadat u op ‘XAMPP voor OS X’ hebt geklikt, niet. Daarom wordt aanbevolen een andere versie van het downloadbestand te selecteren.

Op de pagina ‘Andere versies’ scrolt u omlaag naar de sectie ‘XAMPP voor OS X’.

Download xampp voor OS X 2

Klik op ‘Meer downloads’.

U wordt doorverwezen naar een externe website.

Download xampp voor OS X 3

Selecteer ‘XAMPP Mac OS X’.

En klik vervolgens op ‘7.4.11’. Deze optie heeft de maximale downloads per week.

Download xampp voor OS X 4

Nu zult u twee versies van de software zien.

De eerste is ‘xampp-osx-7.4.11-0-vm.dmg’ en de andere is ‘xampp-osx-7.4.11-0-installer.dmg’.

Download xampp voor OS X 5

Selecteer de ‘installer’-versie.

Als het downloaden is voltooid, dubbelklikt u op de image om het installatieproces te starten.

xampp installatie op Mac

Sleep vervolgens de map XAMPP naar de map Programma’s.

Dat is alles. XAMPP is nu geïnstalleerd onder de map ‘/Applications/XAMPP’.

Dubbelklik op XAMPP. U wordt gevraagd om door te gaan met het openen van de applicatie. Klik op ‘Openen’.

Openen xampp installatie op Mac

Het installatieproces wordt gestart en u kunt de volgende stappen volgen, die voor zichzelf spreken, zoals hieronder weergegeven.

xampp installatie op Mac 1
xampp installatie op Mac 2

In het hierboven getoonde venster kunt u de componenten die u wilt installeren selecteren of deselecteren.

De ‘XAMPP Developer Files’ kunnen desgewenst worden gedeselecteerd. De ‘XAMPP Core Files’ is verplicht en zal geselecteerd blijven.

xampp-installatie op Mac 3
xampp-installatie op Mac 4
xampp-installatie op Mac 5
xampp installatie op Mac 6
xampp installatie op Mac 7

Wanneer het installatieproces is voltooid, start u XAMPP door op de knop ‘Voltooien’ te klikken.

Hiermee wordt het venster van de toepassing geopend, zoals afgebeeld.

xampp-installatie op Mac 8

Klik op ‘Ga naar toepassing’ of typ ‘http://localhost’ in de browser om te controleren of het installatieproces goed is verlopen.

xampp succesvolle installatie op Mac

Als u de bovenstaande pagina ziet, hebt u XAMPP met succes op uw lokale Mac-computer geïnstalleerd.

xampp servers beheren op Mac

Keer terug naar het venster van de toepassing en klik op het tabblad ‘Servers beheren’.

U zult merken dat de ‘Apache Web Server’ standaard draait. Als deze niet draait, kan het zijn dat u geen toegang krijgt tot de localhost pagina. Om de service te starten, hoeft u alleen maar op de knop ‘Start’ te klikken. Om de Apache service te stoppen, klikt u op de ‘Stop’ knop.

Terwijl we dit in de volgende stap behandelen, raad ik u aan ook de ‘MySQL Database’ service te starten.

Nu we XAMPP op onze lokale computer hebben geïnstalleerd, is de volgende stap het installeren van WordPress.

Stap 2. Download en installeer WordPress op uw lokale computer

Download de nieuwste versie van WordPress (momenteel 5.5.3) van WordPress.org.

Download WordPress

Er wordt een ‘wordpress-5.5.3.zip’ bestand gedownload. Pak de inhoud van het bestand uit.

Wordpress-map

Zoals in de bovenstaande afbeelding te zien is, is de inhoud van het bestand uitgepakt naar een map ‘wordpress-5.5.3’. Ja, als u een andere versie van WordPress heeft, zal de mapnaam overeenkomstig veranderen.

Nu kopieert u de map ‘wordpress’. Deze map bevat alle bestanden die nodig zijn om een WordPress website te maken.

Naar de XAMPP map.

XAMPP map

Onder XAMPP, zult u de ‘htdocs’ map zien.

Ga uw gang en plak de map ‘wordpress’ in ‘htdocs’.

Upload WordPress op XAMPP

Als u de map eenmaal in ‘htdocs’ hebt gezet, kunt u de map een naam geven die u zelf kiest. Typisch kunt u de map de naam geven die u aan het maken bent.

Bij wijze van voorbeeld heb ik de map hernoemd naar ‘wpastra’, zoals te zien is in de afbeelding hierboven.

Nu, om toegang te krijgen tot uw WordPress website en om te controleren of de installatie zonder fouten is verlopen, typt u de URL ‘http://localhost/<wordpress-folder>’ in de webbrowser. Waarbij ‘<wordpress-folder>’ de naam is van de map die u heeft opgegeven.

Wat in mijn geval ‘http://localhost/wpastra’ zal zijn.

Uit de succesvolle installatie, zou u de volgende pagina moeten bereiken.

WordPress-taal instellen met XAMPP

Selecteer de taal van uw voorkeur en klik op verder.

Op de volgende pagina, zoals hieronder afgebeeld, wordt u gevraagd de gegevens van uw database in te voeren.

XAMPP enter WordPress database details prompt

En hoe komen we nu precies aan de gegevens van de database?

Wel, dat is waar onze laatste stap in het spel komt.

En even ter aanvulling, de stappen die nodig zijn om WordPress lokaal op een Mac te installeren zijn tot hier hetzelfde.

Stap 3. Het opzetten van de MySQL Database

Hoofd terug naar de localhost hoofdpagina, d.w.z., ‘http://localhost’. U moet nu naar het dashboard worden geleid (http://localhost/dashboard).

XAMPP WordPress database setup 1

Klik op de link ‘phpMyAdmin’ in de rechterbovenhoek van de pagina.

U wordt naar het ‘phpMyAdmin’-dashboard geleid.

XAMPP WordPress database setup 2

Aan de linkerkant ziet u verschillende bestaande databasenamen.

Om een nieuwe database aan te maken, klikt u op het tabblad ‘Databases’ bovenaan.

XAMPP WordPress database setup 3

Voer een ‘Database naam’ in en klik op ‘Create’.

XAMPP WordPress database setup 4

Zo heb ik bijvoorbeeld een database aangemaakt met de naam ‘wpastra’.

XAMPP WordPress database setup 5

Nu de database is aangemaakt, gaat u terug naar de WordPress installatiepagina en klikt u op ‘Let’s go!’.

XAMPP WordPress-installatie database-instellingen

Om te beginnen voert u onder ‘Databasenaam’ de naam in van de database die u zojuist hebt aangemaakt.

Voor de ‘Gebruikersnaam’ voert u hetzelfde in als voor ‘root’. En het veld ‘Wachtwoord’ kunt u leeg laten. Laat de overige twee velden, d.w.z. ‘Database Host’ en ‘Table Prefix’, als de standaardwaarden. Deze zijn respectievelijk ‘localhost’ en ‘wp_’.

Als u klaar bent, klikt u op ‘Submit’.

XAMPP WordPress run installation

U zou nu op de volgende pagina moeten komen. Als dat zo is, dan werkt uw verbinding met de database prima!

Ga uw gang en klik op ‘Voer de installatie uit’.

XAMPP WordPress installatie-instellingen

Voer de ‘Titel van de site’, de ‘Gebruikersnaam’, het ‘Wachtwoord’ en ‘Uw e-mail’ in.

Zoals u in de afbeelding hierboven kunt zien, heb ik de verplichte velden ingevoerd.

En klik vervolgens op ‘WordPress installeren’.

WordPress succesvol geïnstalleerd op windows

Klik op ‘Log in’ zodra de installatie succesvol is afgerond.

WordPress-inlogpagina

En u krijgt uw WordPress-inlogscherm te zien.

Voer de gebruikersnaam en het wachtwoord in die u zojuist hebt aangemaakt.

Wordpress-installatie met behulp van XAMPP

En voilà! U bent op het WordPress dashboard. U heeft een lokale WordPress website gemaakt met behulp van XAMPP.

U kunt uw website benaderen door de URL in te voeren, die voor dit voorbeeld ‘http://localhost/wpastra’ is.

WordPress website op XAMPP

Ga uw gang, installeer uw thema’s, de plugins, test de volledige functionaliteiten, en maak uw WordPress website lokaal aan. De lokale installatie werkt precies hetzelfde als een gehoste versie.

  1. Hoe installeer ik Astra Theme?
  2. Hoe installeer ik Starter Templates (gratis) Plugin?
  3. Beste gratis thema voor Elementor

MySQL instellen op Mac

Hoewel de meeste van de hierboven vermelde stappen bij het opzetten van MySQL en het lokaal aanmaken van de database op het Windows besturingssysteem hetzelfde zijn, zijn er toch een paar verschillen op te merken.

En de stappen die moeten worden opgemerkt, zijn na het invoeren van de databasegegevens.

XAMPP WordPress database-instellingen voor Mac

Zoals hierboven is aangegeven, zijn de stappen tot hier dezelfde als eerder zijn uitgelegd.

Na het invoeren van de databasegegevens klikt u op ‘Verzenden’.

U komt nu op een pagina, zoals hieronder afgebeeld, met een stukje PHP-code.

XAMPP WordPress installatie op Mac wp config instellingen

U moet de hierboven gemarkeerde code kopiëren en een bestand ‘wp-config.php’.

Als alternatief, als u de map ‘wordpress’ controleert die u naar de XAMPP-map hebt overgebracht, ziet u een bestand met de naam ‘wp-config-sample.php’.

wp-config-bestand instellen voor Mac OS

Open dit bestand in een teksteditor van uw keuze. Verwijder de inhoud van het bestand en vervang het door de code die u zojuist hebt gekopieerd. En sla het bestand op.

Als u klaar bent met deze stap, hernoemt u het bestand naar ‘wp-config.php’.

En daarna gaat u terug naar het installatieproces en klikt u op ‘Voer de installatie uit’.

XAMPP WordPress installatie-instellingen

De resterende stappen zijn dezelfde als die welke eerder zijn behandeld bij het instellen van MySQL voor het Windows-besturingssysteem.

WordPress succesvol installeren op Windows

En u zult WordPress ook met succes lokaal op uw Mac-systeem hebben geïnstalleerd.

Troubleshooting van veelvoorkomende problemen tijdens de installatie van XAMPP en WordPress

Het kan zijn dat ik geluk heb gehad tijdens de installatie van XAMPP en WordPress tijdens het maken van dit artikel. Als je echter problemen ondervindt tijdens de installatie, zijn hier links naar enkele veelvoorkomende problemen en hun oplossingen.

  1. XAMPP voor Windows FAQs
  2. XAMPP voor OS X FAQs
  3. XAMPP geïnstalleerd, hoe WordPress toe te voegen

Conclusie

Zoals in dit artikel vermeld, als u een lokale WordPress site wilt maken en de functionaliteiten wilt testen voordat u de site live zet, is het een goede gewoonte om WordPress lokaal op te zetten.

En nu we hebben besproken hoe u een lokale WordPress site kunt maken met XAMPP op zowel het Windows als het Mac besturingssysteem, denken we dat het voor u gemakkelijk zou moeten zijn om door te gaan.

We horen graag van u. Laat het ons weten als u erin geslaagd bent om uw WordPress site lokaal op te zetten met behulp van de bovenstaande stappen.

Geef een antwoord

Het e-mailadres wordt niet gepubliceerd.