Vous avez sauté le pas et avez validé votre nom de domaine avec un certificat TLS/SSL. Très bien ! Voyons comment passer WordPress sur la version sécurisée de votre site.
Il existe des plugins WordPress entièrement dédiés à SSL pour rediriger vers les pages sécurisées mais on peut très bien faire sans, avec un peu d’huile de coude.
Le tutoriel est pour Debian et WordPress tourne sous Apache chez moi. Cela prend moins d’une heure pour configurer l’essentiel mais il est probable que vous ayez des petites corrections (thèmes, plugins) pour que tout soit servi en https.
Le but est de tout (oui, absolument tout!) servir via la connexion sécurisée.
Étape 1 : configurer Apache
On édite notre fichier de configuration :
nano /etc/apache2/sites-available/www.skyminds.netet voici ce que garde pour VirtualHost *:80 :
ServerName www.skyminds.net
ServerAlias skyminds.net
DocumentRoot /home/skyminds/public_html/
Redirect 301 / https://www.skyminds.net/Langage du code : JavaScript (javascript)La directive ServerName est nécessaire. Ensuite, une simple redirection renvoie toutes les requêtes du port 80 vers le port 443, sécurisé. Même pas besoin de mod_rewrite!
On déplace ensuite toutes nos règles WordPress dans VirtualHost *:443 :
ServerAdmin webmaster@localhost
ServerName www.skyminds.net
ServerAlias skyminds.net
DocumentRoot /home/skyminds/public_html/
LogLevel warn
CustomLog /var/log/apache2/www-access.log varnishcombined
ErrorLog /var/log/apache2/www-error.log
# SSL Certificate
# + Ciphers
# + Perfect Forward Secrecy rules
# relire https://www.skyminds.net/serveur-dedie-apache-https-perfect-forward-secrecy/
AllowOverride None
# BEGIN WordPress
RewriteEngine On
RewriteBase /
# SSL
RewriteCond %{SERVER_PORT} !^443$
RewriteRule (.*) https://%{HTTP_HOST}%{REQUEST_URI} [R,L]
# if this request is for "/" or has already been rewritten to WP
RewriteCond $1 ^(index\.php)?$ [OR]
# if request is for image, css, or js file
RewriteCond $1 \.(gif|jpg|png|ico|css|js)$ [NC,OR]
# or if URL resolves to existing file
RewriteCond %{REQUEST_FILENAME} -f [OR]
# or if URL resolves to existing directory
RewriteCond %{REQUEST_FILENAME} -d
# then skip the rewrite to WP
RewriteRule ^(.*)$ - [S=1]
# else rewrite the request to WP
RewriteRule . /index.php [L]
# END wordpress
Options FollowSymLinks
Order allow,deny
Allow from allLangage du code : PHP (php)Vous remarquerez que mes règles WordPress ne sont pas tout à fait standards mais légèrement optimisées depuis quelques années déjà, de manière à limiter les traitements via PHP.
Dans le code ci-dessus, j’ai rajouté ceci pour prendre en compte SSL :
Votre site est trop lent ?
Un WordPress lent, c'est des conversions perdues. J'audite, j'optimise, je documente — et je vous explique ce que j'ai fait et pourquoi. Pas de jargon inutile, que du concret.
Demandez un audit de performance →# SSL
RewriteCond %{SERVER_PORT} !^443$
RewriteRule (.*) https://%{HTTP_HOST}%{REQUEST_URI} [R,L]Langage du code : PHP (php)Enregistrez le fichier et relancez Apache :
service apache2 restartLancez la version https de votre site et vérifiez que votre site est accessible.
Étape 2 : configurer WordPress pour HTTPS
La configuration pour HTTPS se fait en plusieurs étapes. J’ai tenu une liste de tout ce que j’ai eu à faire au fur et à mesure que j’avançais. Voici donc comment procéder.
On édite wp-config.php et on ajoute :
/* SSL
/* The constant FORCE_SSL_ADMIN can be set to true to force all logins and all admin sessions to happen over SSL.
/* http://codex.wordpress.org/Administration_Over_SSL
*/
define('FORCE_SSL_ADMIN', true);Langage du code : PHP (php)Cela force TLS/SSL sur l’administration et la page de connexion de WordPress.
On ajoute (ou on modifie) ensuite les constantes WP_SITEURL et WP_HOME de manière à faire apparaître https :
// HOME
define('WP_SITEURL', 'https://www.skyminds.net');
define('WP_HOME', 'https://www.skyminds.net');Langage du code : JavaScript (javascript)J’ai une préférence pour définir ces constantes dans wp-config.php car je trouve cela plus sécurisé mais vous pouvez bien sûr les modifier dans les réglages généraux de WordPress (Réglages > Général).
Il est temps maintenant de modifier tous les liens du site. On recherche toutes les adresses qui commencent par :
http://www.skyminds.netLangage du code : JavaScript (javascript)et on les remplace par :
http://www.skyminds.netLangage du code : JavaScript (javascript)en lançant la requête SQL suivante :
UPDATE wp_posts SET post_content = REPLACE (post_content,
'http://www.skyminds.net',
'https://www.skyminds.net');Langage du code : JavaScript (javascript)On fait pareil pour les liens dans le texte des commentaires :
UPDATE wp_comments SET comment_content = REPLACE (comment_content,
'http://www.skyminds.net',
'https://www.skyminds.net');Langage du code : JavaScript (javascript)Etape optionnelle : si vous hébergez comme moi vos images sur un sous-domaine, il est nécessaire de suivre cette étape. Idéalement, il faut que ce sous-domaine serve lui aussi les fichiers en TLS/SSL. Passez à l’étape suivante si WordPress gère vos fichiers téléchargés sans configuration particulière de votre part.
Les images et fichiers joints vont poser problème : les fichiers ont été envoyés du temps où le serveur n’avait pas de certificat, donc toutes les images possèdent une adresse en http.
On recherche donc :
http://static.skyminds.netLangage du code : JavaScript (javascript)Et on le remplace avec:
https://www.skyminds.net/wp-content/uploadsLangage du code : JavaScript (javascript)Avec la requête SQL suivante:
UPDATE wp_posts SET post_content = REPLACE (post_content,
'http://static.skyminds.net',
'https://www.skyminds.net/wp-content/uploads');
Langage du code : JavaScript (javascript)Cela modifie l’URI des images déjà uploadées. Pour les futurs uploads, il faut aller dans Réglages > Media et mettre à jour Full URL path to files avec notre nouvelle adresse. (https://www.skyminds.net/wp-content/uploads)
Note : si vous ne trouvez pas Full URL path to files sur la page, installez le plugin WP Original Media Path, mettez à jour la valeur et désinstallez le plugin. Il ne sert qu’à inscrire la valeur dans la base de données.
Il faut ajouter cette fonction dans votre plugin de fonctionnalités :
//Fix SSL on Post Thumbnail URLs
// // https://core.trac.wordpress.org/ticket/15928
function ssl_post_thumbnail_urls($url, $post_id) {
//Skip file attachments
if( !wp_attachment_is_image($post_id) )
return $url;
//Correct protocol for https connections
list($protocol, $uri) = explode('://', $url, 2);
if( is_ssl() ) {
if( 'http' == $protocol )
$protocol = 'https';
} else {
if( 'https' == $protocol )
$protocol = 'http';
}
return $protocol.'://'.$uri;
}
add_filter('wp_get_attachment_url', 'ssl_post_thumbnail_urls', 10, 2);Langage du code : PHP (php)Concrètement, cela teste si le site est servi par https et change l’URL des miniatures à la volée.
Modification, amélioration et nettoyage des fichiers du thème. Je me suis aperçu j’avais hard-codé, par habitude et fainéantise, la plupart des URI dans mon thème. Par conséquent, il existait pas mal de liens directs vers des fichiers en http, principalement dans header.php.
La solution est d’utiliser esc_url( home_url() ) autant que possible à chaque fois que l’on fait appel à un fichier:
<?php
echo esc_url( home_url( '/favicon.ico' ) );
?>Langage du code : HTML, XML (xml)A vérifier également : les liens du header, du menu, de la sidebar, du footer.
Etape 3 : nettoyage, why no padlock?
Voici les différentes icones SSL sous Chrome et leurs significations :
| Icône | Signification |
|---|---|
| Le site n’utilise pas SSL.Cette icône s’affiche pour les sites en http. La plupart des sites n’ont pas besoin d’utiliser SSL, car ils ne gèrent pas des informations confidentielles. Évitez de saisir des informations telles que le numéro de votre carte de paiement ou les informations de connexion à votre banque sur la page. Si des informations confidentielles vous sont demandées sur un site n’utilisant pas le protocole SSL, vous pouvez contacter le propriétaire du site Web. | |
  | Google Chrome a réussi à établir une connexion sécurisée avec le site. Repérez cette icône et assurez-vous que le domaine de l’URL est correct si vous êtes invité à vous connecter à ce site ou à saisir des informations confidentielles sur cette page. Si le site utilise un certificat EV-SSL (Extended Validation SSL), le nom de l’entreprise s’affiche en vert à côté de l’icône. |
  | Le site emploie le protocole SSL, mais Google Chrome a détecté des éléments non sécurisés sur la page. Soyez prudent si vous saisissez des informations confidentielles sur cette page. Tout contenu non sécurisé constitue une faille qu’une personne mal intentionnée peut utiliser pour modifier l’aspect de la page. |
  | Le site utilise SSL, mais du contenu non sécurisé à risque élevé ou des problèmes relatifs au certificat du site ont été détectés sur la page. Ne saisissez pas d’informations confidentielles sur cette page. Un certificat non valide ou d’autres problèmes HTTPS sérieux peuvent indiquer qu’un tiers est en train de tenter de détourner votre connexion au site. |
Il ne vous reste plus qu’à traquer les dernières occurences http et les modifier en https. Le but est d’obtenir le petit cadenas vert : tous les éléments de la page (images, scripts) doivent être servis via HTTPS.
S’il reste des éléments récalcitrants, essayez l’outil en ligne Why No Padlock ? qui permet d’identifier les éléments de la page qui ne sont pas servis par https.
C’est l’étape qui prend pas mal de temps mais permet d’identifier où la validation SSL complète des pages coince.
Étape 4 : indexation
À ce stade, WordPress devrait maintenant être passé entièrement à HTTPS/TLS. Videz le cache et les cookies, relancez Apache et revisitez le site en https.
Il nous reste maintenant à informer les robots de notre changement d’adresse. Voici une dernière checklist pour leur faciliter la tâche :
- réactualisez vos sitemaps pour que les nouvelles URI soient prises en compte.
- corrigez les liens vers les sitemaps dans robots.txt.
- enregistrez la nouvelle URL du site dans Google Webmaster Tools et Bing Webmaster Tools, validez le site, ajoutez vos sitemaps pour l’indexation.
Il ne reste plus qu’à attendre la visite des robots et la mise à jour de l’index des moteurs de recherche.
Conclusion
Voilà, nous touchons à la fin de ce tutoriel. Voilà ce que nous venons de mettre en place sur notre site WordPress : redirection vers HTTPS dans Apache, modification des URI des articles/images/miniatures, admin et login sécurisés, optimisation du thème, et quelques conseils pour l’indexation du site.
Votre site a été piraté ?
Redirections suspectes, pages injectées, compte admin fantôme, blacklist Google — une compromission WordPress ça se nettoie méthodiquement. Je localise l'infection, j'éradique le code malveillant et je referme les portes.
Aidez-moi à reprendre le contrôle →
Un énorme merci pour cette to-do list pour passer son site en https avec wordpress. Je vais franchir le pas dans quelques semaines et je me documente. J’ai bookmarqué ton article et je vais m’appuyer dessus, bien joué pour modifier les liens via les requêtes mysql. Tu vas me faire gagner de précieuses heures. Un grand merci
Je t’en prie Andlil, je suis content que cela puisse t’aider !
Après avoir passé le site en HTTPS, avec les nouveaux posts que j’écris les images sont servies en HTTP :(
Salut Angristan,
Vérifie le chemin complet des fichiers médias dans Settings > Media.
Bonjour,
Merci pour ces explications claires et utiles :)
Si certaines personnes ont encore des éléments non sécurisés sur leurs pages à la fin de la procédure, pensez à regarder du côté de vos plugins.
Dans mon cas, j’avais un problème avec les polices Google (Google fonts). Il m’a donc fallu modifier le fichier « rt-prettyphoto.php » du plugin rt-prettyphoto qui contenait un lien non sécurisé :
;)