Accueil » Conseils & tutoriels sites internet » Tutoriels Wordpress » WordPress WooCommerce : mise en place du SSL HTTPS

WordPress WooCommerce : mise en place du SSL HTTPS

La mise en place d’un certificat SSL (à savoir le HTTPS dans votre URL représentée par un petit cadenas vert dans votre navigateur) est une étape désormais importante, tant sur le sujet de la sécurité du transfert des données entre votre site internet et le navigateur des internautes (ce qui rejoint en un sens les prérequis de la RGPD portant sur la protection des données), mais aussi sur le référencement naturel et les nouvelles normes des navigateurs internet.

Si j’avais déjà évoqué la mise en place d’un certificat SSL sur Prestashop, je me suis rendu compte que je n’en avais jamais parlé en ce qui concerne les sites en WordPress WooCommerce. De vous à moi, cela me paraissait tellement évident que je ne jugeais pas utile d’en faire un article de blog, jusqu’à ce que je reçoive de nombreux messages me demandant comment mettre le SSL en place sur ces systèmes. Si cela est évident pour moi, ça ne l’est pas forcément pour tout le monde !

Voici donc comment mettre en place le HTTPS sur votre site WordPress ou votre boutique WooCommerce, sans distinction. Comme d’habitude, trois étapes très simples, mais rigoureuses !

Sommaire de la mise en place HTTPS SSL sur WordPress WooCommerce

Prenez cependant garde à une chose : forcer le HTTPS sur WordPress WooCommerce ne fonctionnera que si et seulement si votre hébergeur vous a mis en place ce précieux sésame, le certificat SSL. Via les hébergements de la Team nous mettons régulièrement en place Let’s Encrypt, certificat gratuit, mais si vous désirez avoir une assurance pour votre certificat, il est possible d’en disposer d’un payant. Réfléchissez au préalable à l’intérêt que vous avez de disposer d’une assurance sur ce type de certificats (si le HTTPS ne fonctionne plus, aurez-vous besoin d’un dédommagement qu’il faudra estimer en fonction de la perte reçue à cause d’une défaillance du certificat ?). 99% des sites sur lesquels j’ai travaillé utilisent Let’s Encrypt, et même le gouvernement l’utilise pour certains de ses sites…

Sauvegardez vos données !

Je le répète systématiquement – mais le le répèterai cependant jamais assez – il est très important de sauvegarder et d’être en mesure de remettre en place les données de votre site. 

En cas de besoin, ce tutoriel sur la sauvegarde de votre site via Filezilla et PhpMyAdmin sera toujours là pour vous aider à bien réaliser cela, dès que le besoin s’en fait ressentir 🙂

Certains thèmes WordPress incluent des options de thème, que l’on peut exporter et réimporter. Ces options sont très utiles et vous permettent de récupérer toute la personnalisation que vous auriez réalisé depuis le back-office de votre site WordPress. Sauvegardez-les donc bien précieusement sur votre ordinateur, dans un répertoire précis, vous pourriez en avoir besoin ultérieurement.

Rangez dans ce même répertoire votre sauvegarde du site, base de données incluse. Si celle-ci est trop volumineuse, n’hésitez pas à demander à votre hébergeur de vous faire une sauvegarde, ou essayez de voir si depuis votre interface d’hébergement cela n’est pas déjà faisable.

Une fois que vous avez bien tout en place, passez à l’étape suivante.

Correction des entrées en base de données

Attaquons le vif du sujet, vous allez comprendre pourquoi à l’origine je ne pensais pas que cela devais faire l’objet d’un tutoriel. A cette étape, je pars du principe que vous avez bien sauvegardé vos données.

Dans un des (vieux) articles de la Team, j’expliquais comment mettre en ligne un site WordPress WooCommerce grâce à trois requêtes SQL, à adapter selon vos besoins. Ces trois requêtes sont bien plus utiles qu’elles n’en ont l’air, puisqu’elles réalisent un rechercher-remplacer dans trois tables essentielles tables de votre base de données. Elles sont donc réutilisables après adaptation sur tout site utilisant une base de données sur PhpMyAdmin.

Les requêtes sont donc les suivantes, corrigées pour le SSL HTTPS :

UPDATE wp_options SET option_value = REPLACE(option_value, 'http://www.MonSite.tld', 'https://www.MonSite.tld') WHERE INSTR(option_value, 'http://www.MonSite.tld') > 0;

UPDATE wp_posts SET guid = REPLACE(guid, 'http://www.MonSite.tld', 'https://www.MonSite.tld') WHERE INSTR(guid, 'http://www.MonSite.tld') > 0;

UPDATE wp_posts SET post_content = REPLACE(post_content, 'http://www.MonSite.tld', 'https://www.MonSite.tld') WHERE INSTR(post_content, 'http://www.MonSite.tld') > 0;

Avant d’envoyer cela directement dans votre base de données, voici ce qu’il y a à vérifier :

  • le préfixe des tables : ici j’ai noté le préfixe wp_, mais il est probable (et je vous le conseille) que le vôtre soit différent. Adaptez donc le préfixe de ce snippet en mettant le vôtre à la place
  • le nom du site : j’ai noté MonSite.tld, mais dans mon cas je noterai team-ever.com par exemple. Remplacez donc cet élément par le nom de votre site, les élément http et https étant déjà en place

Connectez-vous à PhpMyAdmin, cliquez sur votre base de données, puis cliquez sur l’onglet SQL noté en haut de page. Collez dans l’espace dédié vos requêtes et cliquez sur Exécuter, comme sur l’image ci-dessous :

WordPress WooCommerce : mise en place du SSL HTTPS 1

Le nombre de résultats qui sera affiché vous précisera le nombre d’URL qui ont été corrigées dans votre administration. Cette étape est terminée !

Vérification du contenu

Commencez par vider le cache de votre navigateur. Comme beaucoup de personnes ne savent pas forcément comment faire cela (surtout au vu des différents navigateurs utilisés), la Team a fait en sorte de disposer d’un tutoriel expliquant comment vider le cache navigateur et faire un « flush DNS ». Cela dépend parfois du système d’exploitation que vous utilisez (Mac OS, Windows, Linux, Debian…). Vous pouvez conserver les cookies cependant, afin de rester connecté à votre site.

A partir de ce moment, vous devez avoir un onglet de votre navigateur affichant le back-office de votre site, et sur un autre onglet, vous devez naviguer sur les pages, catégories, produits, articles… Ce afin de détecter toute page sans SSL HTTPS. Fonctionnez en terme de type de contenu avant de regarder plus précisément, vous gagnerez un temps précieux.

a/ options du thème

Commençons par réimporter les options du thème. Si celles-ci incluent des URL à votre site, pensez à les corriger une fois vos options réimportées.

En ce qui me concerne, j’aurais tendance à corriger cela via un IDE, à savoir un logiciel d’édition de code (comme Atom ou Sublime Text) pour disposer directement d’un fichier propre et correct.

Cette étape est bien évidemment inutile si vous n’avez pas ce genre d’options, auquel cas vous pouvez passer à l’étape suivante.

b/ appels à des liens externes et iframes

Certains plugins, pages ou articles peuvent faire référence à du contenu dit « non sécurisé », comme une iframe ou des liens entrants qui ne sont pas en HTTPS.

Outre le fait qu’une iframe, il n’y a rien de plus moche, retirez ce genre de contenu ou corrigez les URL de ces fameuses iframes pour mettre le HTTPS. Sans quoi, ces iframes ne s’afficheront tout simplement pas.

Vérifiez aussi les appels aux scripts javascript et CSS, qui ne seront pas interprétés si ceux-ci ne sont pas en HTTPS. Donc, si vous avez des liens en dur dans vos scripts, ou si vous avez réalisé des appels non sécurisés, c’est le moment de les corriger, sans quoi eux non plus ne seront pas interprétés.

Pour les détecter, rien de plus simple : faites un tour sur votre site, et si le cadenas dans votre barre d’URL n’est pas verte, c’est que du contenu n’est pas en HTTPS est appelé !

c/ forcer le SSL HTTPS 

Dernière étape au cas où, très utile pour tous ces gens qui malgré que le site soit en HTTPS, continuent à se rendre sur le site (via l’administration ou autre) sans prendre en compte ce protocole.

Si vous vous connectez à votre administration WordPress WooCommerce sans HTTPS, le contenu de type image par exemple que vous importerez sera lui aussi sans HTTPS. Afin de palier à cela et de couper court à ce genre de soucis, WordPress a mis à disposition une constante permettant de forcer le SSL dans l’administration. Cela ne coûte rien de l’ajouter par précaution.

Editez le fichier wp-config.php de votre site, et en-dessous de la ligne WP_DEBUG, ajoutez ceci :

define( 'FORCE_SSL_ADMIN', true );

Au passage, vous devriez réfléchir aux constantes WordPress WooCommerce utiles à ajouter sur votre site 🙂

C’est fini ?

Oui, enfin c’est à partir de là surtout que vous allez peut-être trouver de petits bugs, comme ce plugin que vous utilisez (un diaporama par exemple) et qui n’a pas pris en compte la correction. Il faudra donc corriger cela manuellement.

Vérifiez également que votre contenu est bien disponible uniquement en HTTPS, et pas autrement, sinon vous aurez des soucis de contenu dupliqué en terme de référencement.

Concernant la Search Console de Google, comme leur interface n’est pas géniale pour la passation, créez un nouveau compte et conservez le précédent, ce manière à toujours disposer des données quoi qu’il arrive.

Et si vous avez un souci de duplicate content, certains plugins peuvent vous aider, mais une correction dans le fichier htaccess de votre site peut rapidement résoudre cela !

Bonne chance à tous, n’hésitez pas à nous faire part en commentaires des soucis rencontrés, afin que je puisse vous aider et d’en faire part aux internautes 🙂

Imprimer Imprimer
Suivre Cyssoo:

Développeur - formateur

Je cherche à display errors le monde, vous auriez pas la doc' ? Follow me on Twitter !

Laisser un commentaire

Votre adresse e-mail ne sera pas publiée. Les champs obligatoires sont indiqués avec *

Ce site utilise Akismet pour réduire les indésirables. En savoir plus sur comment les données de vos commentaires sont utilisées.