Auteur: Snorskie

  • Cloudflare Setup voor WordPress Website

    Cloudflare Setup voor WordPress Website

    Een langzamere WordPress website kan je bezoekers kosten. In dit stappenplan laat ik hoe je Cloudflare installeert om je website sneller, veiliger en betrouwbaarder te maken – zonder extra caching-plugins.

    πŸ“‹ Wat Je Gaat Bereiken:
    Resultaat Verwachting
    Desktop Snelheid 97/100
    Mobiel Snelheid 96/100
    Security Bot-bescherming + brute force preventie
    Onderhoud Geen caching-plugins nodig
    βš™οΈ Vereisten:
    Benodigd Waarom
    Hosting account (FlexWebHosting, etc.) Voor File Manager toegang
    WordPress dashboard toegang Voor plugin-instellingen
    Cloudflare account (gratis) Voor DNS en caching
    πŸ“ Stap-voor-stap Installatie:
    Stap 1: Cloudflare Account Aanmaken

    1. Ga naar www.cloudflare.com
    2. Klik “Sign Up” (gratis plan is voldoende)
    3. Registreer met je e-mailadres
    4. Bevestig je account via de e-mail

    Stap 2: Domein Toevoegen aan Cloudflare

    1. Log in op Cloudflare Dashboard
    2. Klik “Add a Site”
    3. Vul jouw domein in: jouwwebsite.nl
    4. Selecteer “Free Plan” (gratis)
    5. Klik “Continue”

    Cloudflare scant nu je bestaande DNS-records.

    Stap 3: DNS Migreren naar Cloudflare

    1. Noteer de nameservers die Cloudflare geeft (bijv.):
      ns1.cloudflare.com
      ns2.cloudflare.com
    2. Ga naar je hosting provider (FlexWebHosting)
    3. Open DNS Management / Nameserver instellingen
    4. Vervang huidige nameservers door Cloudflare’s
    5. Sla op

    ⏳ Propagation duurt 5-60 minuten. Je site blijft online tijdens deze periode!

    Stap 4: SSL Certificaat Activeren

    1. Cloudflare β†’ SSL/TLS β†’ Overview
    2. Selecteer “Full” of “Flexible” encryptie
    3. Voor WordPress: kies “Flexible” als je hosting geen SSL heeft
    4. Sla op

    Stap 5: Security Instellingen Configureren

    1. Cloudflare β†’ Security β†’ WAF
    2. Activere “Bot Fight Mode”
    3. Activere “Leaked Credentials Mitigation”
    4. Sla op

    Deze beschermen tegen kwaadaardige bots en brute force aanvallen.

    Stap 6: Page Rules Instellen (Belangrijk!)
    Dit zorgt dat admin-pagina’s nooit worden gecached.

    1. Cloudflare β†’ Rules β†’ Page Rules
    2. Create Page Rule #1:
      URL: jouwwebsite.nl/wp-admin
      Cache Level: Bypass
      Order: First
      Save
    3. Create Page Rule #2:
      URL: jouwwebsite.nl/wp-login.php
      Cache Level: Bypass
      Order: First
      Save
    4. Create Page Rule #3:
      URL: www.jouwwebsite.nl/wp-admin
      Cache Level: Bypass
      Order: First
      Save
    5. Create Page Rule #4:
      URL: www.jouwwebsite.nl/wp-login.php
      Cache Level: Bypass
      Order: First
      Save

    πŸ’‘ Gratis plan heeft max 3 Page Rules. Gebruik wildcards als alternatief:

    Regel 1: /wp-admin/ β†’ Bypass
    Regel 2: /wp-login.php β†’ Bypass Regel 3: jouwwebsite.nl/ β†’ Cache Everything (optioneel)

    Stap 7: Caching Optimale Instellingen

    1. Cloudflare β†’ Caching β†’ Configuration
    2. Set “Cache Level” op Standard
    3. Set “Respectful Browser Cache” op ON
    4. Sla op

    Je WordPress cache plugins zijn niet nodig met deze setup!

    Stap 8: Cache Purgen Na Wijzigingen
    Elke keer als je CSS, plugins of pagina’s wijzigt:

    1. Cloudflare β†’ Caching β†’ Configuration
    2. Klik “Purge Everything” (rode knop)
    3. Bevestig

    Dit zorgt dat bezoekers direct de nieuwe versie zien.

    🎨 Bonus: Custom Login Page Styling
    Wil je je login-pagina professioneel maken? Voeg deze CSS toe via Avada Branding β†’ Login Page β†’ Custom CSS:

    /* Login container styling */
    body.login .login-form,
    .login .login-form {
    background-color: #000000 !important;
    border: none !important;
    border-radius: 15px !important;
    box-shadow: none !important;
    }
    
    /* Invoervelden donker */
    .login .input,
    .login input[type="text"],
    .login input[type="password"] {
    background-color: #3c3c47 !important;
    color: #ffffff !important;
    border-radius: 5px !important;
    }
    
    /* Login knop */
    .login .submit input[type="submit"] {
    background-color: #3c3c47 !important;
    color: #ffffff !important;
    border-radius: 5px !important;
    padding: 10px 25px !important;
    }

    πŸ“Š Resultaat Verwachting:
    Metric Score
    Desktop Pagespeed 97/100
    Mobiel Pagespeed 96/100
    Laadtijd Desktop <0,5s
    Laadtijd Mobiel <2,5s
    βœ… Checklist Na Installatie:
    βœ… DNS migratie voltooid
    βœ… Bot Fight Mode actief
    βœ… Page Rules ingesteld (wp-admin bypass)
    βœ… SSL actief
    βœ… Cache purge na wijzigingen
    βœ… Login page getest (beide accounts)
    βœ… Snelheid getest via Pagespeed Insights

    πŸš€ Tips Voor Toekomst:
    Situatie Actie
    Website traag? Cloudflare β†’ “Purge Everything”
    Nieuwe plugin? Cache purgen na installatie
    CSS aangepast? Hard refresh (Ctrl+F5) in browser
    Twijfel over instelling? Begin met Free plan, upgrade later
    ⚠️ Belangrijke Opmerkingen:
    Geen caching-plugins nodig: Cloudflare Page Rules doen hetzelfde werk
    Security: Bot Fight Mode + Leaked Credentials = dubbele bescherming
    Onderhoud: Minimaal! Alleen cache purgen bij wijzigingen
    Kosten: Gratis plan is voldoende voor de meeste websites
    Met deze setup is je WordPress website snel, veilig en onderhoudsvriendelijk! πŸŽ‰

    Geschreven door Snorskie – Web Developer & Cloudflare Expert

    Datum: August 2025

    Deel dit artikel als het nuttig was!