Het doen van grote wijzigingen aan je website kan risico’s met zich meebrengen. Het is bijvoorbeeld nooit leuk om wijzigingen aan te brengen en vervolgens te moeten constateren dat je website is gecrasht. En als je een nieuwe website bouwt kan het handig zijn om een kopie van de huidige site als uitgangspunt te nemen. Maar ook als je helemaal opnieuw begint, is het vaak prettig als je iets even kunt testen op een kopie van je werk. Sommige ontwikkelaars gebruiken zelfs drie of vier verschillende versies van dezelfde site om hun code te testen voordat deze uiteindelijk live gaat.
Een ontwikkelomgeving oftewel een staging website
Zo’n kopie van je website is dus een ontwikkelomgeving voor je (nieuwe) website. Men noemt zo’n kopie ook wel een staging website. Een staging website is een kloon van een website en geeft je de gelegenheid om de website van een nieuwe lay-out te voorzien of nieuwe functies te testen.
Het grote voordeel van een staging website: wijzigingen die je aanbrengt op je staging website, hebben geen invloed op je live website. Daardoor is een staging website ideaal om een nieuwe website te bouwen of om bijvoorbeeld plugins of scripts te testen terwijl de oude website gewoon online blijft.
Op het moment dat je tevreden bent over het resultaat zet je met een paar eenvoudige handelingen de ontwikkelsite live.
Hoe kun je staging website opzetten?
Veel WordPress ontwikkelaars en websitebouwers gebruiken voor het maken van een staging website de plugin WP Staging. Dat is een gratis plugin die gemakkelijk in gebruik is. Als je alle functies wilt gebruiken, dien je de niet gratis pro versie aan te schaffen.
Voor Joomla wordt vaak StageIt gebruikt. Deze extensie is niet gratis.
Sinds kort heeft Installatron ook de mogelijkheid om een staging website op te zetten. In al onze hostingpakketten kun je gratis gebruik maken van alle functies van Installatron. En dus is het opzetten van een staging website gratis en bovendien een fluitje van een cent. Net zo gemakkelijk kun je wijzigingen doorvoeren naar de live site. Dat gaat in een paar muisklikken.
In deze tutorial leg ik uit hoe je een staging website opzet met behulp van Installatron. Ik ga daarbij uit van een WordPress website, maar mijn uitleg kun je ook toepassen op een Joomla website.
Stappen om een staging website op te zetten
Ik ga er in deze tutorial vanuit dat je een kopie wilt van je huidige website en dat de kopie de staging website wordt. Evengoed kun je natuurlijk helemaal opnieuw beginnen en van dat nieuwe begin een of meerdere klonen maken die je gebruikt voor testdoeleinden. Maar als je weet hoe je een staging website opzet aan de hand van de huidige website, dan kun je dat ook zonder problemen toepassen op een nieuwe site die je aan het bouwen bent.
Het handigst is het om de staging website op een subdomein te zetten. Dit zijn dan de stappen:
- Nieuw subdomein aanmaken
- SSL-certificaat aanpassen zodat het subdomein ook bereikbaar is via HTTPS
- Staging website maken
Stap 1: nieuw subdomein aanmaken
Bij elk hostingpakket van Stip Hosting kun je een onbeperkt aantal subdomeinen aanmaken. Die subdomeinen maak je aan in het hosting control panel DirectAdmin.
- Log in op DirectAdmin.
- Klik onder het kopje Account Manager op Subdomain Management.
- Klik rechtsboven op de knop Add Subdomain.
- Typ in de pop-up die nu verschijnt de naam van het subdomein (het deel dat voor de punt van je domeinnaam komt) en klik daarna op de knop Add Subdomain.
- Het nieuwe subdomein wordt nu aangemaakt. Klik linksboven op het logo van DirectAdmin om terug te gaan naar het beginscherm.
Stap 2: SSL-certificaat aanpassen
Het subdomein wordt niet standaard voorzien van een SSL-certificaat. In deze stap zorg je ervoor dat het subdomein ook gebruik kan maken van HTTPS.
- Klik in DirectAdmin onder het kopje Account Manager op SSL Certificates.
- Selecteer Free & automatic certificate from Let’s Encrypt.
- Zorg ervoor dat je in ieder geval het volgende aanvinkt:
– je domeinnaam zonder www
– je domeinnaam met www
– mail als je gebruik maakt van e-mail via Stip Hosting
– het nieuwe subdomein zonder www
– het nieuwe subdomein met www - Klik op Save en wacht tot het certificaat is aangemaakt. Sluit de pop-up door op het kruisje in de rechter bovenhoek te klikken.
- Klik linksboven op het logo van DirectAdmin om terug te gaan naar het beginscherm.
Stap 3: staging website maken
Alle voorbereidingen zijn nu getroffen en je bent klaar om de staging website aan te maken met Installatron.
- Scrol in DirectAdmin naar beneden tot je het icoontje van je website ziet. Als je een WordPress website hebt, is het een WordPress icoon en bij een Joomla website natuurlijk een Joomla icoon. Klik op het icoon van je website.
- In het volgende venster zie je een miniatuurafbeelding van je website. Zie je die niet, klik dan nog even op het tabblad My Applications.
Aan de rechterkant staan een aantal kleine knoppen. Klik op de knop Clone.
- Selecteer bij Domain het subdomein in, bijvoorbeeld https://staging.stiphosting.nl en maak het vakje Directory leeg. Plaats een vinkje bij Create staging site?
- Scrol naar beneden en klik op de knop Clone. De staging site wordt nu aangemaakt. Als het proces is voltooid kun je inloggen op je staging website met de inloggegevens van de live website.
In het overzicht van je websites wordt de staging website gearceerd weergegeven. Klik op het tabblad My Applications om dit overzicht te bekijken.
Wijzigingen overzetten naar de live site
Als de nieuwe website klaar is of als je de nieuwe functies voldoende hebt getest, is het tijd om van de ontwikkelsite de live site te maken. In de tussentijd moet er dan niets veranderd zijn aan de inhoud van de live website, omdat de staging website die wijzigingen overschrijft. Als er bijvoorbeeld ondertussen nieuwe content is toegevoegd, dan kun je het beste eerst die content ook even toevoegen aan de staging website. Pas daarna zet je de staging website op de plek van de live website.
- Controleer of er wijzigingen zijn geweest op de live website en zet de wijzigingen op de staging website via het beheer van de WordPress website.
- Log in op DirectAdmin, scrol naar beneden en klik op het icoon van je live website.
- Klik bij de website op de knop Sync.
- In het volgende venster staat bij Source (bron) de staging website, bij Destination (bestemming) je live website. De mappen, bestanden en tabellen van de database zijn automatisch aangevinkt. Bij back-up is standaard geselecteerd dat er eerst een back-up gemaakt moet worden. Laat de instellingen ongewijzigd en klik onderaan op de knop Sync.
- Installatron maakt eerst een back-up van je huidige live website en plaatst daarna de staging website ervoor in de plaats.
- Controleer de website en verwijder de staging website als je hem niet meer nodig hebt door in Installatron op het knopje met het kruisje te klikken bij de staging website. Klik daarna op de knop Uninstall om de staging website te verwijderen.
