ELKE WEBSITE KAN
VERBETERD WORDEN

Webdesign, webdevelopment, beveiliging en marketing

WordPress SSL certificaat Installeren

In heel veel posts komen we terug op SSL certificaten. Omdat deze een zeer belangrijke factor zijn m.b.t. de veiligheid van uw eigen website of websites die we bezoeken.

Nog even in het kort: SSL certificaten zorgen ervoor dat de verbinding tussen de computer van de bezoeker en de webhost voorzien is van een encryptie waardoor deze lijn als “veilig” beschouwd mag worden. Een SSL verbinding is te herkennen aan het httpS voorvoegsel voor de domeinnaam. Soms is de balk van het webadres groen. Deze website is dan beschermd met een “extended validation” SSL certificaat (ofwel een EV-SSL). Dit type certificaat voldoet aan specifieke eisen omtrent identiteitscontrole.

ssl-certificaten-stap0

Meer over SSL certificaten in het algemeen en hoe deze werken kunt u hier vinden.

In dit voorbeeld:

In dit voorbeeld wil ik mijn website met daarop een WordPress systeem volledig laten werken op SSL (dus zowel de frontend als de backend via SSL). Ik wil ook dat alle http aanvragen automatisch altijd gerouteerd worden naar https.

In dit voorbeeld ga ik te werk met een Extendend Validation SSL certificaat waardoor ik de bekende groene balk krijg nadat de verbinding succesvol versleuteld is. De werkwijze (m.u.v. de aanvraag procedure) is echter hetzelfde voor een SSL certificaat als voor een Extended Validation SSL certificaat.

Voordelen en Nadelen van HTTPS:

Alvorens de overweging gemaakt kan worden om een SSL certificaat aan te schaffen is het goed om de voor en nadelen tegen elkaar af te wegen:

Voordelen:

  • Verificatie van integriteit: Er vanuit kunnen gaan dat onze data niet gemanipuleerd wordt en dat retour data niet gemanipuleerd is.
  • Authenticatie: Weten met wie we verbinden waarbij de authenticiteit gecontroleerd is.
  • Betrouwbaarheid: Erop kunnen vertrouwen dat data veilig en privé verzonden en ontvangen wordt.
  • SEO Optimalisatie: Correct gebruik van een SSL certificaat is een van de weegpunten van Google voor het verbeteren van de SEO score. Dit is echter een punt met een lichte weging. Voor de kosten en effort die er gemaakt moeten worden kunnen SEO technisch betere weegpunten behaald worden.
  • Vertrouwen: Een HTTPS verbinding en zeker een groene balk wekt vertrouwen van de bezoeker.

Nadelen:

  • Moeilijk om correct te integreren.
  • Hoge (periodieke) kosten
  • Vertraging met het laden van de pagina. Data moet met encryptie verzonden worden. Dit kost processorkracht, meer requests en dus tijd! HTTPS zorgt overigens niet voor een grote vertraging maar is wel een eigenschap die niet vergeten mag worden in de overweging.

HTTPS, SSL en TLS:

In deze post komen we verschillende termen tegen waaronder HTTPS, SSL en TLS. Hieronder even in het kort de verschillen:

SSL:
SSL staat voor “Secure Socket Layer”. SSL is een techniek van data encryptie die we prima online kunnen gebruiken. Deze techniek maakt gebruik van certificaten. We noemen deze certificaten dus voor het gemak SSL certificaten. Er bestaan meerdere versies van SSL. Na SSL versie 3 kwam TLS versie 1 uit (eigenlijk SSL 3.1).

TLS:
De nieuwe versie van SSL. Het TLS protocol heeft een paar andere eigenschapen dan SSL. Zo werkt TLS over een bi-directionele datastroom en niet alleen over internet sockets zoals SSL.

HTTPS:
HTTPS is het voorvoegsel dat we voor het domeinnaam zien staan bij een “secure site”. HTTPS staat voor HyperText Transfer Protocol Secure. Dit is dus een HTTP request die gebruik maakt van SSL/TLS om de datastroom van punt A naar punt B te beveiligen.

We hebben nodig:

Als alle voor en nadelen tegen elkaar afgewogen zijn en u beslist om door te gaan met de installatie van een SSL certificaat dan zijn er een paar zaken vereist.

Om een SSL certificaat te installeren moet het domein werken op een uniek IP adres (dus een eigen IP adres i.p.v. een gedeeld IP adres). Eveneens hebben we toegang tot het SSL portaal nodig via de webadmin.

SSL certificaat aanvragen:

Een SSL certificaat kunt u bij verschillende instanties aanvragen. Persoonlijk ben ik erg gecharmeerd van Comodo en GoDaddy. In dit voorbeeld gaan we uit van de laatste.

Ga naar je webadmin en open het gedeelte om je SSL certificaten te beheren. In dit voorbeeld gebruiken we DirectAdmin.

Kies ervoor om een Certificate Request te genereren en vul de juiste gegevens in.

ssl-certificaat-stap1

Vervolgens krijgen we een cryptische code. Dit is je certificate request waarmee je het certificaat gaat aanvragen. Bewaar deze dus goed.

ssl-certificaat-stap2Bij GoDaddy heb je de mogelijkheid om zelf een certificaat aan te maken. Tijdens het aanvragen wordt allereerst je Certificate Request key gevraagd. Vul deze in. Kies ook voor de juiste encryptie (die je ook gekozen hebt tijdens het aanmaken van de sleutel).

Vul vervolgens nog een aantal persoonlijke gegevens in en dien de aanvraag in.

De aanvraag van een Extended Validation Certificate kan tot 2 maanden duren maar is vaak sneller. Hierbij worden voor gegevens gevalideerd en moet de aanvraag persoonlijk (telefonisch) bevestigd worden. De aanvraagperiode voor een gewoon certificaat is minder lang. Deze duurt gemiddeld een week en hier is geen persoonlijke goedkeuring voor nodig.

Zodra het certificaat goedgekeurd is kunt u de verkregen private key + het certificaat kopiëren via uw webpanel. In DirectAdmin kiest u voor de optie: “Paste a pre-generated certificate and key”. Na het plakken van de juiste gegevens klikt u op “opslaan”. Het certificaat is bij deze succesvol geïnstalleerd en uw website is benaderbaar via https. Al het verkeer via https is nu versleuteld.

ssl-certificaat-stap3

Nadat het SSL certificaat succesvol geïnstalleerd is moeten we ervoor zorgen dat de website ook werkt over HTTPS.

WordPress over SSL laten werken:

Om dit voor elkaar te krijgen gaan we in WordPress naar Instellingen – Algemeen. Hier veranderen we de WordPress-adres (URL) en het Siteadres (URL) van HTTP naar HTTPS.

Wordpress over SSL laten werken

Permalinks aanpassen:

Waarschijnlijk werkt je website met SEO vriendelijke URL’s…toch? Hiervoor gebruik je in WordPress de Permalink optie. Om deze opnieuw te genereren navigeer je naar Instellingen – Permalinks en klik je nogmaals op de “Opslaan” button. Mocht dit niet werken kies dan voor een andere structuur, sla deze op en verander de structuur daarna weer terug naar de structuur zoals deze hoort te zijn.

Veilig inloggen en een veilige WordPress backend:

Om ervoor te zorgen dat je login gegevens encrypted verzonden worden kun je de volgende regel aan je wp-config.php bestand toevoegen:


define(‘FORCE_SSL_LOGIN’, true);

Om het inloggen + de gehele backend te beveiligen kun je beter de volgende regel toevoegen aan het wp-config.php bestand.


define(‘FORCE_SSL_ADMIN’, true);

Forceer HTTP naar HTTPS met 301 redirect:

Momenteel kunnen je pagina’s over HTTP en HTTPS geopend worden. Dit willen we natuurlijk niet. Dit is niet goed vanuit SEO oogpunt (duplicated content) en de mogelijkheid bestaat nog dat er onveilig gecommuniceerd kan worden. We willen dus dat URL’s alleen over HTTPS geopend kunnen worden en dat de HTTP verwijzingen automatisch omgezet worden naar HTTPS. We doen dit met een 301 redirect zodat Google weet dat de URL’s permanent verplaatst zijn.
Om dit te doen gaan we de volgende code toevoegen aan ons .htaccess bestand:


RewriteEngine On
RewriteCond %{HTTPS} off
RewriteRule (.*) https://%{HTTP_HOST}%{REQUEST_URI} [R=301,L]

Content aanpassen:

Je website beschikt over veel content op veel verschillende locaties. Denk hierbij aan pagina’s, posts, images, links, template files, plug-ins etc. Het is nu zaak om alle content verwijzingen (naar afbeeldingen, downloads, files etc.) om te zetten naar HTTPS.

Als u een relatief pad zoals “/images/afbeelding.jpg” gebruikt is dat natuurlijk niet nodig. Maar als er een volledig absoluut pad gebruikt wordt zoals “https://mijndomein.nl/images/afbeelding.jpg” dan moet HTTP in deze URL omgezet worden naar HTTPS. U kunt ook een protocol onafhankelijke link gebruiken. I.p.v. HTTP of HTTPS kunt u 2 foreward slashes gebruiken waardoor de URL er als volgt uitziet: “//mijndomein.nl/images/afbeelding.jpg”.

Als u het lastig vindt om onveilige content op uw pagina te vinden dan kunt u de pagina laden in Firefox met de Firebug applicatie geladen of in Google Chrome met de Web Developper Tools. Op de console tab van deze tools is dan gemakkelijk te zien wat de onveilige content is die geladen is.

Test uw website in alle bestaande resoluties en ook op mobiele apparaten zodat deze overal volledig over SSL geladen wordt.

Je website in Google:

Als je een bestande website (geheel of gedeeltelijk) omzet van HTTP naar HTTPS dan is het zaak om dit goed en duidelijk aan te geven bij Google. Door dit netjes aan te geven verlies je geen PageRank en blijven de zoekresultaten gelijk.

Als je je complete website van HTTP naar HTTPS hebt omgezet dan is het goed om in e loggen bij de Google Webmaster Tools. Verwijder de oude URL en voeg de nieuwe URL met HTTPS voorvoegsel toe.

Zorg er ook voor dat u een nieuwe sitemap.xml genereerd en dat u de juiste sitemap weer toevoegd aan de webmaster tools.

Pas eventueel ook uw robots.txt bestand aan als hier HTTP verwijzingen in staan en zorg ervoor dat “Canonical URL’s” ook de HTTPS variant gebruiken.

Specifieke onderdelen HTTPS:

In dit voorbeeld hebben we ervoor gekozen om de gehele website om te zetten naar HTTPS / SSL. Als u echter alleen specifieke onderdelen zoals b.v. een orderpagina wilt forceren om HTTPS te gebruiken dan kunt u gebruik maken van de WordPress HTTPS (SSL) plugin. Maar u kunt dit ook handmatig doen middels onderstaande script. Dit script dient u toe te voegen aan de functions.php file en in het script moeten de juiste pagina ID’s worden ingevuld van de pagina’s die je geforceerd in HTTPS wilt laden.

SSL login specific pages

HSTS Header (HTTP Strict Transport Security):

De HSTS Header is een speciale header die ervoor zorgt dat data altijd over HTTPS verzonden wordt. Het beschermd de website tegen zogenaamde “downgrade attacks” en biedt ook bescherming tegen “Cookie Hijacking” en “SSL-Stripping Man in the Middle Attacks”. De meeste browsers ondersteunen de HSTS Header. Daarnaast zorgt de HSTS Header implementatie voor een snelheid winst omdat data op een effectievere manier tussen hosts verzonden wordt. De eerste keer dat de browser de pagina bezoekt over HTTP zal deze header hem vertellen om voortaan de pagina over HTTPS te laden. Hierdoor wordt de laadtijd in het vervolg sneller. De browser probeert de website pas weer over http te laden als de max-age variabele verstreken is. De max-age variabele wordt uitgedrukt in seconden.

Implementatie van de HSTS Header is een absolute aanrader en kan middels verschillende manieren. Dit kan via Apache of via PHP. In dit geval implementeren we een PHP script in de index.php file (in de root van de WordPress installatie).

HSTS Header

Om te controleren hoe de HSTS header geïmplementeerd is kunt u de online SSL checker van SSlabs gebruiken.

SSL Q5 Score

Conclusie:

Het beveiligen van een website met een SSL certificaat om HTTPS mogelijk te maken kan een lastig en kostbaar proces zijn. In ruil daarvoor krijgt de website een boost qua vertrouwen en veiligheid. Een leuke bijkomstigheid is dat het positief kan werken voor de SEO resultaten maar let wel op als je een bestaande website omzet naar HTTPS. Voorkom duplicated content en zorg ervoor dat je alle SEO guidelines hanteert zodat je je SEO score kunt behouden.

Ik hoop dat deze WordPress SSL Installatie Handleiding behulpzaam is geweest tijdens de installatie. Bij problemen staan we natuurlijk altijd klaar om u te helpen! Graag tot de volgende post!

Offerte Configurator
Offerte nodig? Dat kan!
Met onze offerte configurator kunt u eenvoudig uw wensen aangeven, waarop u vervolgens een offerte op maat krijgt. Lekker snel en eenvoudig!
Top