Refonte d’un site WordPress => Tutoriel Complet

Comment faire la refonte d’un site WordPress ? Ou le tutoriel complet pour savoir comment modifier son site WordPress grâce à un espace de développement temporaire tout en laissant la version d’origine en ligne et accessible à vos lecteurs.

Que vous ayez besoin de redonner un coup de jeune à votre WordPress ou que vous ayez envie de changements ou d’optimisations afin d’améliorer les performances, la refonte d’un site WordPress est (ou sera) un incontournable pour tout utilisateur.

Plusieurs solutions s’offrent à l’aventurier qui souhaite procéder à la refonte totale de son site WordPress : créer un espace de développement en local (hors ligne), créer un site de “staging” depuis son hébergement, utiliser un plugin de duplication…

Dans cet article nous allons voir les différentes options pour réaliser la refonte d’un site WordPress sans avoir à mettre son site en maintenance pendant des semaines. Car oui spoiler : faire la refonte d’un site WordPress peut facilement prendre plusieurs semaines alors déjà que c’est le stress, autant éviter de vous arracher les cheveux !

Préambule à toute refonte /!\

Avant toute chose et en préambule, n’oubliez surtout pas d’effectuer une sauvegarde complète de vos fichiers et de votre base de données.

Prenez votre temps, une refonte ne se fait pas en 5 minutes, soyez méticuleux et patient.

Enfin, choisissez l’option (parmi celles proposées ci-après) qui vous convient le mieux et avec laquelle vous serez le plus à l’aise.

1. Refonte d’un site WordPress en local

La première option (pas la plus simple) c’est de faire une refonte d’un site WordPress “en local”. Qu’est-ce que cela veut dire ? Cela signifie qu’on va mettre en place un environnement de production virtuel directement sur son ordinateur, “en local” en opposition à “en ligne”. On pourrait aussi parler d’une espace “hors ligne”.

Vous allez me dire : “mais comment peut-on travailler sur un site sans être sur internet” ? Et bien chers amis, c’est possible, il suffit d’utiliser les bons logiciels pour cela. Le principe est compliqué à expliquer simple : le logiciel s’occupe de simuler un environnement de production complet comme si vous aviez un hébergement web avec une base de données et un espace FTP (mais en fait vous n’en avez pas. Vous suivez ?).

Étapes d’une refonte d’un site WordPress en local

Avant de voir en détail les différentes étapes nécessaires pour faire une refonte d’un site WordPress en local, voici un petit résumé :

• Créer une copie de son site WordPress (fichiers + base de donnée)
• Installer un logiciel de développement local et créer l’environnement
• Installer WordPress sur l’environnement local
• Importer le contenu de son site et la base de données sur l’environnement local
• Effectuer toutes les modifications souhaitées sur le site en local
• Créer une copie de ce nouveau site
• Remplacer l’ancien site WordPress par le nouveau.
• Vérifier la réécriture des URLs

Réécriture des URLs en local

C’est important d’en parler avant toute chose car c’est surement l’étape la plus sensible d’une refonte d’un site WordPress en local.

En effet lorsque vous créez un environnement local, toutes les pages de votre nouveau site utiliseront des URLs type https://localhost:8888/mon-titre-de-page.

Au moment de remplacer votre site en ligne avec le contenu de votre nouveau site que vous avez développé en local, il va falloir réécrire toutes les URLs pour qu’elles correspondent à votre nom de domaine. En gros votre page https://localhost:8888/mon-titre-de-page doit devenir https://mon-sitte.com/mon-titre-de-page.

Lors de la migration, cela ne pose généralement pas de problèmes pour les URLs des articles et pages, en revanche pour les URLs des fichiers médias (images) cela peut être plus compliqué.

Pour réécrire les URLs il y a plusieurs méthodes dont on va parler dans la suite de cet article :

• Utiliser un plugin de duplication qui s’occupe automatique de la réécriture des URLs.
• Utiliser un plugin de réécriture des URLS type “Better Search and replace“.
• Utiliser une commande pour remplacer les URLs directement dans votre base de donnée PHP (non recommandé).

Logiciels pour créer un environnement de développement local

Pour créer un environnement de développement local, vous allez installer sur votre ordinateur un logiciel spécialisé. Vous pouvez utiliser l’un des deux logiciels les plus réputés :

• MAMP (pour Mac ou PC, vous trouverez la documentation ici)
• XAMPP (pour Mac ou PC)

Il existe aussi Desktop Server (pour Mac et PC) ou WampServer (pour PC) ou Instant WP (pour Mac et PC).

Ces logiciels offrent tous les outils pour développer un site WordPress en local : un serveur FTP et une base de donnée.

Une fois le logiciel installé, il va falloir récupérer le contenu de son site en ligne et donc créer une copie complète de votre site pour pouvoir l’utiliser en local.

Créer une copie locale de votre site pour faire une refonte

Il y a plusieurs façons de créer une copie d’un site WordPress. La plus connue consiste à utiliser un plugin, l’autre de passer par votre serveur FTP et enfin la dernière d’utiliser la fonction d’export native sur WordPress.

Les deux dernières options ne permettent d’exporter que votre contenu “dur” c’est-à-dire les fichiers de votre installation WordPress, vos thèmes, plugins et vos images. À cela doit être associé un export de votre base de données depuis votre administration PHP chez votre hébergeur web.

Créer une copie locale avec un plugin de migration

Plusieurs plugins permettent de créer une copie complète (ou partielle) de votre site WordPress. Dans la plupart des cas vous aurez le choix des éléments à copier : WordPress, Thèmes, Plugins, Médias, Base de données.

L’intérêt de passer par un plugin c’est que tout va être automatisé et notamment la réécriture des URLs.

Dans la plupart des cas le fonctionnement d’un plugin pour dupliquer un site WordPress est le suivant :

• On installe le plugin de migration sur le site en ligne.
• On exporte tout le contenu de son site avec le plugin sur son ordinateur.
• On installe le plugin sur le site de développement.
• On importe le contenu avec le plugin depuis son ordinateur.

Le problème avec cette méthode réside dans les limites imposées par les versions gratuites des plugins de migration, principalement au moment de l’importation sur le site de développement. Lors de l’export, tout se passe bien, on est ravi, et puis au moment de l’importation le plugin nous explique que notre site est trop lourd et qu’il faudra la version payante pour importer le contenu.

Une solution pour contourner ce problème, c’est de n’utiliser le plugin de migration exclusivement pour la base de données et de s’occuper de tous les fichiers du dossier WordPress à la main.

Les plugins les plus utilisés pour créer une copie d’un site WordPress :

• Duplicator : la version gratuite limite la taille du site à 500 Mo. Donc si votre site “pèse” plus de 500 Mo en tout, il faudra passer à la version payant.
• All in One WP migration : un autre géant, qui lui aussi limite l’importation à 520 Mo

Créer une copie de la base de données avec un plugin et une copie des fichiers manuellement

Cette méthode permet d’utiliser les avantages du plugin de migration pour automatiser la partie la plus sensible d’une migration : le remplacement de la base de données. Ainsi, pas de souci concernant les modifications d’URLs.

Les étapes :

• Télécharger tout le contenu du dossier WordPress depuis son serveur FTP en ligne
• Uploader tout le contenu du dossier WordPress sur le serveur FTP en local
• Exporter la base de données du site en ligne avec le plugin de migration
• Importer la base de données téléchargée sur la nouvelle base de données en local
• Vérifier si les identifiants de la base de données dans le fichier wp-config.php en local correspondent

Créer une copie avec la fonction export de WordPress

Franchement, cette fonctionnalité ne vaut pas la peine d’être utilisé dans le cas d’une refonte d’un site WordPress. Cela ne permet pas d’exporter les thèmes ni les fichiers WordPress, et bien sûr pas la base de données. Bref, cela complique plus la refonte d’un site WordPress qu’autre chose.

Mettre en ligne la refonte d’un site WordPress local

À cette ultime étape, on a terminé la refonte de son site en local et on veut le mettre en ligne. On a les mêmes options que dans l’étape précédente : on fait tout avec un plugin si son site est léger (mois de 500 Mo) ou un mixte entre plugin et manuel.

Mettre en ligne son site avec un plugin de migration

Si vous avez un site qui pèse moins de 500 Mo, utilisez un plugin.

• Installer le plugin de migration sur votre site en local
• Exporter la base de données en suivant les recommandations du plugin
• Installer le plugin de migration sur votre site en ligne
• Importer la nouvelle base de données en suivant les recommandations du plugin
• Vérifier si les identifiants de la base de données dans le fichier wp-config.php correspondent

Mettre en ligne ses fichiers manuellement et sa base de données avec un plugin

Si votre site pèse plus de 500 Mo, on va remplacer les fichiers à la main et remplacer la base de données avec un plugin de migration.

• Installer le plugin de migration sur votre site local
• Exporter la base de données en suivant les recommandations du plugin
• Télécharger tout le contenu du dossier WordPress depuis le serveur FTP local
• Mettre son site en ligne en maintenance
• Remplacer tout le contenu du dossier WordPress sur le serveur FTP en ligne par le nouveau contenu
• Installer le plugin de migration sur votre site en ligne
• Importer la nouvelle base de données en suivant les recommandations du plugin
• Vérifier si les identifiants de la base de données dans le fichier wp-config.php correspondant
• Vérifier l’URL de votre site dans Réglages/Général et enregistrer le format de vos permaliens dans Réglages/Permaliens
• Vérifier si toutes vos URLs fonctionnement bien (y compris les URLs des images).
• Si vous constatez un problème, utiliser un plugin “Search and replace” pour scanner les URLs et remplacer la racine de l’URL avec votre nom de domaine.

Pour avoir plus d’infos vous pouvez relire : Comment migrer son WordPress en local vers un hébergeur ?

2. Refonte d’un site WordPress via un site de staging sur votre serveur d’hébergement web

C’est de mon point de vue, la façon la plus simple et pratique de faire une refonte d’un site WordPress. Pourquoi ? Parce que l’on va s’éviter toutes les étapes énumérées précédemment.

Aujourd’hui, à l’instar de WPServeur, de nombreux hébergeurs web proposent un service de clonage de site et de staging. Il s’agit d’une fonctionnalité qui automatise l’entièreté du processus de duplication et de remise en ligne.

Pour schématiser, voilà comment cela fonctionne chez la plupart des (bons) hébergeurs :

• Cliquez sur un bouton type “cloner” qui va dupliquer votre site dans un nouveau dossier de votre serveur
• Modifiez votre contenu sur ce clone de votre site
• Cliquez sur un bouton type “mettre en production” et voilà !

Plutôt bien, non ?

Vérifier si mon hébergeur propose une fonctionnalité de staging

Si vous ne savez pas, vérifiez-donc si votre hébergeur propose une fonctionnalité pour cloner votre site et faire une version de staging pour faire la refonte d’un site WordPress.

Contacter votre hébergeur

Pour cela vous pouvez directement contacter le service client de votre hébergeur et leur poser la question. Ils sauront vous conseiller et vous expliquer quelle solution ils offrent.

Vérifier sur l’administration de votre serveur d’hébergement Web

L’autre possibilité, si vous êtes habitués à administrer le côté serveur de votre site WordPress, est de vous connecter au tableau d’administration de votre serveur, la plupart du temps il s’agit du fameux Cpanel.

Une fois connecté vous pouvez chercher si une fonctionnalité de clonage et de staging existe, voici quelques exemples :

• Softaculous
• Installatron
• WP Toolkit
• Etc.

Cette façon de créer un environnement de développement afin de réaliser une refonte d’un site WordPress est sans aucun doute la plus simple, la plus pratique, ET la plus à même d’éviter les problèmes !

Exemple de refonte d’un site WordPress avec Softaculous

Pour vous montrer la facilité avec laquelle on peut créer un site de staging pour travailler toute quiétude sur des modifications de son site WordPress nous allons prendre exemple sur l’application Softaculous potentiellement présente sur votre Cpanel.

• Ouvrir votre Cpanel
• Cherchez l’application “Softaculous”

• Dans Softaculous cliquer sur l’icone WordPress
• Cliquer sur le bouton “Balayage” pour scanner votre hébergement et afficher votre site WordPress

• Lancer le scan

• De retour dans l’administration Softaculous votre site apparait dans la liste
• Ouvrir la fenêtre

• Cliquer sur le bouton “Staging”

• Choisir l’emplacement où sera installé votre site de staging sur votre FTP

Pour cette partie, vous pouvez soit créer un dossier sur votre domaine actuel ou prévoir le coup en amont en créant un sous-domaine dédié à votre site de staging (par exemple “staging.mondomaine.com”). Vous devez l’avoir fait avant pour le voir apparaitre dans la liste des domaines disponibles.

• Choisir le nom de votre nouvelle base de données liée à ce nouveau site

Pour cette partie, tout dépendra de votre offre d’hébergement. Pour installer un site de staging, il vous faut une base de données dédiée donc il vous faut un hébergement qui vous offre la possibilité de créer plusieurs bases de données.

• Cocher la case pour désactiver l’indexation dans les moteurs de recherche
• Donner un nom à votre site de staging
• Cliquer sur le bouton pour créer votre site de développement

• Retourner dans l’administration Softaculous
• Votre site de staging apparait dans la liste
• Vous pouvez maintenant vous y connecter avec les mêmes identifiants que votre site actuel à l’adresse que vous aurez choisi dans l’étape précédente (par exemple “staging.mondomaine.com/wp-loging.php” (vous pouvez même y accéder directement en cliquant sur le bouton “Connexion”)

Voilà ! Vous avez maintenant une installation WordPress autonome dans un dossier séparé de votre site en ligne, avec une base de données séparée. À partir de là, la refonte d’un site WordPress se fait les doigts dans le nez. Vous pouvez réaliser toutes les modifications que vous souhaitez sur ce site de staging, cela n’aura aucune incidence sur le site en ligne.

Comment mettre le site de staging en production fois la refonte d’un site WordPress terminée

Quand la refonte de votre site WordPress est terminée, retournez dans Softaculous sur votre Cpanel pour envoyer les modifications en production. Encore une fois cela va se faire très simplement en 1 clic.

• Ouvrir la fenêtre du site de staging
• Cliquer sur le bouton “Envoyer en production”

• Cliquer sur le bouton “Push do Live”
• Votre nouveau site avec toutes les modifications apportées est en ligne !
• Vous pouvez supprimer le site de staging depuis Softaculous pour faire de la place sur votre serveur si besoin.

3. Refonte d’un site WordPress avec un plugin de staging

Vous l’avez compris la possibilité de créer un site de staging est beaucoup plus pratique (de mon point de vue) que de vouloir faire une installation en local (à moins d’être sûr de devoir travailler sans avoir internet).

Si votre hébergeur ne propose pas la fonctionnalité de création d’un site de staging, changez d’hébergeur. Non, enfin si, mais bon, non. Une autre solution peut être trouvée au travers d’un plugin WordPress. Mais il faudra forcément passer par une version PRO et donc payante pour avoir les fonctionnalités recherchées, c’est-à-dire :

• cloner en un clic
• pousser en production en un clic

Le plugin le plus réputé en la matière s’appelle WP Staging.

Utiliser WP Staging pour une refonte d’un site WordPress

WP Staging est un plugin tout-en-un de duplication, de staging et de sauvegarde (en fonction des plans choisis). Le plugin permet de créer une copie exacte ou une sauvegarde de votre site web en quelques secondes. Le temps de clonage et de sauvegarde va dépendre de la taille de votre site WordPress.

Limites du plugin WP Staging en version gratuite

Le principal problème de la version gratuite c’est que le plugin ne permet de pousser le site cloné en production… et ça bah c’est pas terrible étant donné que c’est exactement ce dont on a besoin ici.

Autre problème, contrairement à la version Pro qui vous permet d’utiliser une base de données séparée, ici, le plugin gratuit va dupliquer les tables à l’intérieur de votre base de données actuelle. Vous vous retrouvez donc avec une base de données deux fois plus lourde (cela peut poser des problèmes en fonction es limites imposées par votre hébergement). Et si vous souhaitez supprimer ce clone, il faudra donc supprimer à la main à la fois les fichiers sur votre FTP et les tables créées sur votre base de données.

WP Staging en version Pro pour une refonte d’un site WordPress

Pour bien faire la refonte d’un site WordPress avec le plugin WP Staging il faudra donc passer par la version Pro. Elle qui permet de réaliser les mêmes opérations qu’une fonctionnalité de staging sur un hébergement web.

WP Staging dans sa version Pro permet de créer des sauvegardes de votre site WordPress ou de créer un site de staging, un clone de votre site Web dans un sous-dossier ou un sous-domaine de votre installation WordPress principale.

WP staging va exécuter toutes les opérations de clonage et de sauvegarde de la base de données et des fichiers qui prennent du temps en arrière-plan. Le plugin s’occupe également des réécritures d’URLs automatiquement sous la forme d’une recherche et un remplacement de tous les liens et chemins.

Tarifs de WP Staging

• Plan “Personal” : $178 pour 1 site
• Pan “Business” : $278 pour 3 sites
• Plan “Developper” : $398 pour un nombre de sites illimités

WP Staging	Gratuit	Pro
Cloner un site WordPress	X	X
Cloner une installation WordPress multisites		X
Cloner vers une base de données séparée		X
Cloner vers un sous-domaine ou un domaine personnalisé		X
Cloner vers un dossier FTP personnalisé		X
Pousser le site de staging en production en un clic		X
Accès personnalisé au site de staging par le biais de rôles d’utilisateurs.		X
Sauvegarde, téléchargement et restauration de votre site web		X
Migrer et transférer votre site web vers un autre serveur ou domaine		X

Conclusion sur la refonte d’un WordPress

Pour conclure, vous l’aurez compris, la solution la plus simple pour réaliser la refonte d’un site WordPress est d’utiliser les fonctionnalités proposées par votre hébergeur pour créer un site de staging. Cela nous ramène à l’importance de choisir un bon hébergeur !

Votre hébergement ne vous offre pas cette fonctionnalité, c’est peut-être la bonne occasion pour changer d’hébergeur ?

L’autre possibilité est de tester les autres méthodes décrites dans ce tuto, et pourquoi pas WP Staging dans sa version gratuite pour commencer…