Je WordPress-website als basis voor een ontwikkelomgeving!

Je hebt een stabiele, snelle WordPress-website opgebouwd en alles is naar wens. Toch wil je graag eens een nieuwe layout proberen. Dat test je liever niet direct op je actieve site, maar op een afgeschermde kopie ervan. Eerder las je daarom al hoe je een ontwikkelomgeving opzet. Hier lees je hoe je jouw bestaande website daar als basis voor gebruikt!

Je WordPress-website als basis voor een ontwikkelomgeving!

Binnen een ontwikkelomgeving kun je een website aanpassen, zonder dat je hoofdwebsite wordt gewijzigd. Handig als je een nieuw thema wilt uitproberen of zeker wilt weten of een update van een plugin geen problemen oplevert.

Daarom leg ik je uit hoe je een ontwikkelomgeving kunt creëren met een kopie van je huidige WordPress-website als basis. En hoe je de ontwikkelwebsite als je primaire website kunt gaan gebruiken, als je dat later wilt. In stappen:

Stap 1: je website naar een submap kopiëren

Het gemakkelijkst is om je WordPress-installatie met Installatron te beheren. Daar kun je eenvoudig een exacte kopie van je website maken.

TIP!
Heb je WordPress via een andere weg geïnstalleerd? Geen probleem, je kunt je applicatie alsnog eenvoudig naar Installatron importeren.

Klik in DirectAdmin onder Web Applications op je applicatie en kies voor het icoontje met de twee pijlen om dit proces te starten. Er opent zich een nieuw venster dat bijna gelijk is aan het installatievenster van Installatron.

De knop in Installatron om een applicatie te kopiëren.

Het is hier vooral belangrijk om de Domain en Directory goed in te stellen. Bij Domain selecteer je de juiste domeinnaam, dus de locatie waar de website nu op te zien is. Bij Directory verzin je een map voor de ontwikkelomgeving. Als voorbeeld noemen we hier de map “ontwikkelomgeving”.

Je applicatie eenvoudig kopiëren via Installatron.

Heb je alles goed ingesteld? Dan kun je onderaan op de knop Clone klikken. Installatron maakt nu een kopie van je huidige website op de ingestelde directory. Als het klonen is voltooid, dan zul je onder My Applications netjes de gekloonde website zien staan en kun je de ontwikkelomgeving bereiken.

Optioneel: scherm je ontwikkelomgeving af

Vaak is het gewenst om de ontwikkelomgeving af te schermen voor het publiek. Je kunt dit doen door een onderhoudsplugin te downloaden, maar je kunt het ook gemakkelijk afschermen met behulp van DirectAdmin.

Binnen DirectAdmin ga je hiervoor naar de File Manager en blader je naar de map die je voor je ontwikkelomgeving gebruikt. Bij die map klik je op Protect om er een wachtwoordbeveiliging voor in te stellen.

Klik op 'Protect' bij een map om er een wachtwoordbescherming voor in te stellen.

Er opent zich dan een pagina waarin je kunt aangeven met welke gegevens de betreffende map te bereiken moet zijn. Er zal worden gevraagd naar de onderstaande gegevens.

  • Protected Directory Prompt | De naam die verschijnt in het venster, waarin het wachtwoord moet worden ingevuld.
  • Set/Update User | De gebruikersnaam waarmee ingelogd kan worden.
  • Password en Re-Enter Password | Het wachtwoord waarmee ingelogd kan worden onder de bovenstaande gebruiker.
  • Protection Enabled | Schakelt de beveiliging voor een bepaalde map in of uit. Belangrijk om aan te vinken als je het wilt afschermen!

Nadat je de bovenstaande gegevens hebt ingevuld en een vinkje hebt gezet bij Protection Enabled klik je op Save. Je map zal nu netjes worden beschermt met een gebruikersnaam en wachtwoord.

Een map afschermen met een wachtwoord.

Stap 2: je huidige website vervangen

Je bent klaar bent met het wijzigen van je website, alles binnen de ontwikkelomgeving staat naar wens. Nu wil je graag dat je bezoekers de aangepaste versie te zien krijgen en niet meer de huidige. Hoe doe je dat?

In deze stap verplaats je alle data in de /public_html/-map naar een submap, bijvoorbeeld /public_html/oud/. In de /public_html/-map staan nu namelijk de bestanden van je huidige, actieve website.

De bestanden verplaatsen kan gemakkelijk met een FTP-programma, maar ook via de File Manager van DirectAdmin. Je kunt in DirectAdmin de onderstaande stappen volgen om dit te realiseren.

  • Log in op DirectAdmin en klik op File Manager.
  • Navigeer naar de /public_html/-map.
  • Maak een nieuwe map aan om jouw huidige website naar te verplaatsen. Dit doe je door bij Create New Folder een mapnaam in te vullen.
  • Klik daarna op Create om de map daadwerkelijk aan te maken.
  • Selecteer alle bestanden in je /public_html/-map door bovenin op Select te klikken.
  • Haal het vinkje weg bij de map die je net hebt aangemaakt en ook bij de map van je ontwikkelomgeving. Beide mappen wil je niet verplaatsen.
  • Klik na het selecteren van de bestanden en mappen onderaan op Add to Clipboard. Zo kopieer je de geselecteerde bestanden naar het klembord.
  • Klik op de map die je hier bij de vierde stap hebt aangemaakt.
  • Als je in de map zit, klik je onderaan op Move Clipboard Files Here. De eerder geselecteerde bestanden worden dan naar deze map verplaatst.

Je hebt nu met succes je oude websitebestanden naar een submap verplaatst. Tijd om de website binnen je ontwikkelomgeving live te gaan zetten!

Let op: vergeten installaties & kwetsbaarheden
Bewaar je oude website niet te lang op je pakket. WordPress wordt regelmatig voorzien van updates. Voer je die niet uit, dan kunnen er kwetsbaarheden ontstaan. Zodra je nieuwe website naar behoren werkt, kun je de oude website verwijderen of naar je PC downloaden.

Stap 3: je nieuwe website live zetten

Om de gewijzigde website in je ontwikkelomgeving live te zetten, moet je de bestanden uit de submap halen en naar de /public_html/-map verplaatsen. Hiervoor kun je weer gebruikmaken van de File Manager van DirectAdmin.

  • Binnen DirectAdmin ga je naar de File Manager, navigeer je naar de /public_html/-map en open je de map van je ontwikkelomgeving.
  • Nu je binnen de map van je ontwikkelomgeving zit, selecteer je alle bestanden door bovenin te kiezen voor Select.
  • Vervolgens klik je onderaan op de knop Add to Clipboard om alle bestanden te kopiëren.
  • Ga terug naar je /public_html/-map en klik onderaan de File Manager op Move Clipboard Files here. Alle bestanden van je ontwikkelomgeving worden nu overgezet naar je /public_html/-map.

De URL in WordPress wijzigen

In geval van WordPress is het nu nodig om de URL van je WordPress-installatie te wijzigen. Simpel gezegd, je moet WordPress “vertellen” dat de applicatie op andere locatie terecht is gekomen. Hoe je dat precies doet, wordt in dit handige stappenplan uitgelegd.

Het .htaccess-bestand controleren

Controleer ten slotte het .htaccess-bestand, te vinden de /public_html/-map van je pakket. Open dit bestand via de File Manager van DirectAdmin door op Edit te klikken.

# BEGIN WordPress
RewriteEngine On
RewriteBase /
RewriteRule ^index\.php$ - [L]
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule . /index.php [L]
# END WordPress

Op de een-na-laatste regel zie je waarschijnlijk de mapnaam staan van je ontwikkelomgeving, gevolgd door /index.php (bijvoorbeeld  /ontwikkelomgeving/index.php). Haal de mapnaam van je ontwikkelomgeving daar weg, zodat het wordt als de bovenstaande regels. Klik daarna op Save.

Tot slot

Door je huidige website een-op-een te kopiëren naar een ontwikkelomgeving kun je verder bouwen aan je website, zonder dat je bezoekers daar iets van merken. Dit geeft je ook de mogelijkheid om een nieuwe layout of functies uitgebreid te testen. Wil je ook aan de slag met een website, maar heb je nog geen hostingpakket? Kijk snel wat wij je kunnen bieden!

Kies je webhostingpakket →

P.S. Wil je op de hoogte blijven van alle artikelen, updates, tips en trucs die verschijnen op ons blog? Dat kan! Rechts bovenin via RSS, e-mail, het liken op Facebook, het +1’en op Google+ of het volgen op Twitter.

Deel Tweet +1 Deel