✦ Oplossingen · Website & hosting

Mixed content na het aanzetten van SSL (geen slotje)

Site op https, maar geen slotje of ontbrekende afbeeldingen? Dan laadt de pagina nog onderdelen via http. Zo vind je die mixed content en zet je alle adressen om naar https.

Waarom gebeurt dit?

Bij mixed content laadt een https-pagina onderdelen via http: afbeeldingen, scripts, stylesheets of lettertypes. Browsers blokkeren onveilige scripts en stylesheets, en tonen bij andere onderdelen geen volledig slotje. Je ziet dan een kapotte opmaak, ontbrekende afbeeldingen of een waarschuwing.

In WordPress staan de oude http-adressen vaak in de database: in berichten, widgets, instellingen van het thema en page builders. Ook hard gecodeerde adressen in het thema komen voor.

Zo los je het op, stap voor stap

Menunamen kunnen per versie of toestel iets anders heten. Loop de stappen op volgorde af en stop zodra het werkt.

  1. Vind de http-onderdelen

    Open de ontwikkelaarstools van de browser (F12) en kijk in de Console naar meldingen over 'Mixed Content'. Die noemen het precieze adres.

  2. Zet de site-URL op https

    In WordPress onder Instellingen › Algemeen beide adressen met https. Controleer ook dat de hele site naar https doorverwijst (één keer).

  3. Vervang http-adressen in de database

    Gebruik een zoek-en-vervang die rekening houdt met geserialiseerde data. Met WP-CLI kan het veilig, eerst als droge run. Maak altijd vooraf een back-up.

    wp search-replace 'http://www.voorbeeld.nl' 'https://www.voorbeeld.nl' --all-tables --dry-run
    wp search-replace 'http://www.voorbeeld.nl' 'https://www.voorbeeld.nl' --all-tables
  4. Pas hard gecodeerde adressen aan

    Zoek in het thema en in eigen code naar http://. Gebruik relatieve adressen of functies die het juiste protocol geven.

  5. Laat de browser oude links opwaarderen

    Als vangnet kun je de browser vragen http-onderdelen via https te laden. Dat lost alleen iets op als het onderdeel ook via https bereikbaar is.

    # nginx
    add_header Content-Security-Policy "upgrade-insecure-requests" always;

Let op: Een gewone zoek-en-vervang in een SQL-dump kan geserialiseerde gegevens van WordPress breken, omdat daar de lengte van tekst in staat. Gebruik daarom WP-CLI of een plugin die dat ondersteunt.

Lukt het niet? Wij helpen

Kom je er met deze stappen niet uit, of wil je het liever niet zelf doen? We kijken online mee of komen langs. Hulp op afstand kost €20 per uur; komen we langs, dan is de prijs op aanvraag. Je weet vooraf waar je aan toe bent.

Aanvraag

Hulp aanvragen

Schrijf kort wat er misgaat en wat je al hebt geprobeerd. Kies of we bellen, online meekijken of langskomen.

Veelgestelde vragen

Vragen over dit probleem

Ik zie het slotje op de homepage maar niet op andere pagina's.

Op die pagina's staat nog een http-onderdeel, bijvoorbeeld een afbeelding in de inhoud. De console van de browser wijst het aan.

Lost een SSL-plugin dit op?

Zo'n plugin vervangt adressen vaak tijdens het laden. Dat werkt, maar kost bij elke pagina rekenwerk. Beter is de adressen eenmalig in de database aan te passen.

Externe afbeeldingen laden nog via http.

Dan moet de externe bron ook https ondersteunen. Doet hij dat niet, host het bestand dan zelf.