Savoir comment pousser un site de développement WordPress (dev) en direct est crucial pour maintenir le temps de fonctionnement tout en mettant à jour votre site. Cela est particulièrement utile pour les agences qui gèrent et mettent à jour un grand nombre de sites Web, ainsi que pour les propriétaires de sites Web qui cherchent à apporter une mise à jour importante à leur site actuel. L’utilisation d’un site de développement vous permet d’apporter des modifications à un site sans affecter le site en ligne. Une fois les modifications apportées, il vous suffit de les mettre en ligne.

Dans cet article, nous allons vous présenter trois méthodes (en détail) pour mettre en ligne un site de développement ou de préparation. Mais d’abord, clarifions certains termes.

Bien qu’il puisse y avoir des différences entre ces termes, nous utiliserons les termes « site de développement » (ou « site dev »), « site de préparation » et « site local » comme synonymes. Il s’agit d’environnements de test qui permettent aux utilisateurs d’apporter des modifications à leurs sites WordPress sans que cela n’affecte le site réel. De même, un « site en direct » ou « site de production » est un site Web que vous voulez que les visiteurs voient sur le Web.

Ce qu’il faut faire avant la mise en ligne

Il y a quelques choses que vous pouvez faire pour vous préparer à réussir avant de commencer officiellement à pousser votre site de développement vers la production.

Checklist - Push Dev Site Live
  • https://www.facebook.com/lafactoryworld
  • https://twitter.com/lafactory
  • Gmail
  • https://www.linkedin.com/company/lafactory-inc

Image par Vector Stock Pro / shutterstock.com

  1. Assurez-vous que le site de développement est entièrement fonctionnel – Vous devez vous assurer que votre site de développement est entièrement fonctionnel avant de le transférer sur votre site réel. C’est là tout l’intérêt de travailler dans un bac à sable ou un environnement de test : vous pouvez vous assurer que les modifications que vous apportez fonctionnent correctement avant de les lâcher sur un site réel.
  2. Sauvegardez les deux sites Web – Vous voudrez sauvegarder votre ou vos sites Web. Il est plus sûr d’aller de l’avant et de sauvegarder à la fois votre site de développement et votre site réel, bien que le site réel soit le plus important des deux puisqu’il s’agit du site que vous essayez de protéger. Il existe quelques options de plugins de sauvegarde WordPress pour vous aider si vous en avez besoin. En dehors des sauvegardes de plugins, votre hébergeur peut offrir une sorte de service pour les sauvegardes. Consultez la base de connaissances de votre hébergeur pour voir ce qu’il propose en matière de sauvegardes.
  3. Déterminez la bonne méthode. – Une fois que votre site de développement est fonctionnel et que vos sites sont sauvegardés, vous pouvez commencer à décider de l’option qui vous convient le mieux pour mettre en ligne le site de développement. Nous allons aborder trois méthodes en détail ci-dessous.

Comment pousser le site de développement en production

Il y a trois façons de pousser un site de développement WordPress vers un site en ligne. Vous avez le choix entre les options suivantes :

  • Utiliser un plugin de migration WordPress
  • Pousser manuellement votre site de développement
  • et Utiliser les outils de migration d’un hébergeur

Tous les principaux plugins de mise en scène/migration sur le marché utilisent un modèle de prix freemium où certaines options ne sont pas utilisables à moins de payer pour les obtenir. Il vaut la peine de regarder ce qui est offert dans les versions gratuites des principaux plugins de migration et de mise en scène pour voir s’ils répondent à vos besoins. Dans cet article, nous utiliserons le plugin WP Migrate Lite de Delicious Brains. La version Pro rend ce processus beaucoup plus simple et transfère plus que la base de données du site de développement (laversion Lite ne transfère pas les fichiers de plugins, de médias ou de thèmes vers le site réel).

La méthode manuelle est destinée à ceux qui sont familiers avec phpMyAdmin et cPanel. Cette approche est très pratique et comporte de nombreuses étapes. Elle vaut vraiment la peine si vous essayez d’en savoir plus sur le fonctionnement de WordPress en arrière-plan. Mais il vous faudra un certain temps pour le terminer.

Nous avons constaté que les fournisseurs d’hébergement qui ont des outils de mise en scène intégrés à leur plate-forme offrent l’option la plus facile pour pousser un site de développement vers un site réel. Nous allons voir comment les outils de mise en scène de Siteground rendent cela très facile.

Transférer un site de développement vers un site réel avec WP Migrate (Plugin – Version gratuite)

Pour pousser un site de développement vers votre site en ligne avec un plugin, nous utiliserons WP Migrate. Il s’agit de l’un des meilleurs plugins de migration du marché, qui dispose d’une version gratuite. De plus, la version pro rend le processus encore plus facile.

*Remarque : la plupart des plugins de mise en scène et de migration proposent une version gratuite, mais la version payante permet d’en faire plus

Après avoir téléchargé et activé WP Migrate sur votre site de développement WordPress et votre site réel, naviguez sur votre site de développement (gardez les deux ouverts dans des onglets séparés). Dans Outils, cliquez sur Migrer la base de données.

Dev Push Live - WP Migrate 1-2_num
  • https://www.facebook.com/lafactoryworld
  • https://twitter.com/lafactory
  • Gmail
  • https://www.linkedin.com/company/lafactory-inc

Près du sommet, cliquez sur Migrer et ensuite sous « Remplacer un autre site par ce site » cliquez sur Exporter la base de données.

Dev Push Live - WP Migrate 3-4_num
  • https://www.facebook.com/lafactoryworld
  • https://twitter.com/lafactory
  • Gmail
  • https://www.linkedin.com/company/lafactory-inc

Nous arrivons ensuite à un écran où nous allons remplacer les chaînes de notre base de données pour qu’elles correspondent à celles de notre site réel. Cela garantit que, lorsque nous importons les informations migrées/poussées du site de développement vers le site réel, le site ne tombera pas en panne.

Remarquez sur le côté droit les deux zones de texte « Remplacer » qui devront être remplies.

Dev Push Live - WP Migrate 5_num
  • https://www.facebook.com/lafactoryworld
  • https://twitter.com/lafactory
  • Gmail
  • https://www.linkedin.com/company/lafactory-inc

Ensuite, nous allons passer à l’onglet ouvert qui contient notre site en direct. Nous allons au même endroit dans le même plugin. Nous faisons référence et copions ce que le site réel a dans la colonne de recherche. Ces éléments seront collés sur le site de développement.

Dev Push Live - WP Migrate 6_num
  • https://www.facebook.com/lafactoryworld
  • https://twitter.com/lafactory
  • Gmail
  • https://www.linkedin.com/company/lafactory-inc

Une fois que nous avons collé les éléments du site en direct sur le site de développement (reportez-vous aux deux images précédentes si vous vous trompez), nous sommes prêts à exporter la base de données sur le site de développement. Ceci téléchargera un fichier exporté de la base de données du site de développement (les fichiers de thèmes, de plugins et de médias ne seront pas inclus dans ce fichier et nécessiteront la version Pro de WP Migrate pour être transférés facilement entre vos sites).

Dev Push Live - WP Migrate 7_num
  • https://www.facebook.com/lafactoryworld
  • https://twitter.com/lafactory
  • Gmail
  • https://www.linkedin.com/company/lafactory-inc

Vous devriez voir une invite d’exportation complète.

Dev Push Live - WP Migrate 8_num
  • https://www.facebook.com/lafactoryworld
  • https://twitter.com/lafactory
  • Gmail
  • https://www.linkedin.com/company/lafactory-inc

Maintenant que nous avons le fichier .sql exporté, nous devons faire quelque chose avec lui. Vous allez naviguer dans le C-Panel de votre site Live et sous la section « Databases », cliquez sur phpMyAdmin.

Maintenant que nous avons le fichier .sql exporté, nous devons faire quelque chose avec lui. Naviguez dans le panneau de contrôle de votre site et, dans la section « Bases de données », cliquez sur phpMyAdmin.

Dev Push Live - WP Migrate 9_num
  • https://www.facebook.com/lafactoryworld
  • https://twitter.com/lafactory
  • Gmail
  • https://www.linkedin.com/company/lafactory-inc

Près du centre supérieur, cliquez sur Import. Sur la page qui se charge, vous devez rechercher le fichier qui a été téléchargé sur votre ordinateur, puis lancer l’importation en cliquant sur Go en bas à gauche de la page. Cette opération importera les bases de données du site de développement vers votre site réel.

Dev Push Live - WP Migrate 10-12_num
  • https://www.facebook.com/lafactoryworld
  • https://twitter.com/lafactory
  • Gmail
  • https://www.linkedin.com/company/lafactory-inc

Une fois cette opération effectuée, vérifiez votre site en ligne pour vous assurer qu’il est opérationnel et que les modifications apportées au site de développement sont prises en compte sur le site en ligne.

Transférer manuellement le site de développement vers le site réel

Il est tout à fait possible de pousser manuellement un site de développement vers votre site réel. Ce n’est pas pour les âmes sensibles mais c’est une bonne connaissance pour ceux qui essaient de se familiariser avec les bases de données WordPress et le cPanel. Ces étapes fonctionnent avec n’importe quel fournisseur d’hébergement qui utilise encore cPanel.

Télécharger les fichiers nécessaires depuis le site de développement

La première chose que nous allons faire est de naviguer dans votre cPanel sur votre site de développement. À partir de là, nous trouverons le gestionnaire de fichiers et ouvrirons le répertoire racine des documents de votre site de développement, puis nous cliquerons sur Aller.

Dev Site to Live - Manual 1-2
  • https://www.facebook.com/lafactoryworld
  • https://twitter.com/lafactory
  • Gmail
  • https://www.linkedin.com/company/lafactory-inc

De là, nous voulons cliquer sur wp-content et compresser ce dossier.

Dev Site to Live - Manual 3-4
  • https://www.facebook.com/lafactoryworld
  • https://twitter.com/lafactory
  • Gmail
  • https://www.linkedin.com/company/lafactory-inc

Cela crée un nouveau fichier compressé wp-content.zip. Cliquez sur le nouveau fichier zip et sélectionnez télécharger.

Dev Site to Live - Manual 5
  • https://www.facebook.com/lafactoryworld
  • https://twitter.com/lafactory
  • Gmail
  • https://www.linkedin.com/company/lafactory-inc

Ensuite, nous voulons trouver le fichier wp-config.php du site de développement et le télécharger également sur votre ordinateur.

Dev Site to Live - Manual 6
  • https://www.facebook.com/lafactoryworld
  • https://twitter.com/lafactory
  • Gmail
  • https://www.linkedin.com/company/lafactory-inc

Exportation de la base de données du site de développement

Ensuite, retournez dans votre cPanel ; sous Bases de données, cliquez sur phpMyAdmin.

Back to phpMyAdmin
  • https://www.facebook.com/lafactoryworld
  • https://twitter.com/lafactory
  • Gmail
  • https://www.linkedin.com/company/lafactory-inc

Dans la barre latérale de gauche, cliquez sur la base de données qui correspond à la base de données de votre site de développement WordPress. Cliquez sur Vérifier tout, puis sur Exporter en utilisant le menu déroulant.

Dev Site to Live - Manual 7-8
  • https://www.facebook.com/lafactoryworld
  • https://twitter.com/lafactory
  • Gmail
  • https://www.linkedin.com/company/lafactory-inc

Sur l’écran suivant, assurez-vous simplement que la méthode d’exportation est définie sur rapide et que le format est SQL. Cliquez ensuite sur Go.

Nous avons téléchargé les fichiers essentiels de votre site de développement que nous allons télécharger et configurer sur votre site réel. Cela donnera au site réel la configuration que vous avez établie sur votre site de développement pendant que vous le testiez et le construisiez.

Dev Site to Live - Manual 9-10
  • https://www.facebook.com/lafactoryworld
  • https://twitter.com/lafactory
  • Gmail
  • https://www.linkedin.com/company/lafactory-inc

Importation de la base de données sur le site réel

Maintenant, allez dans le cPanel du site en direct (PAS le site de développement). Cliquez sur phpMyAdmin.

Dev Site to Live - Manual 11
  • https://www.facebook.com/lafactoryworld
  • https://twitter.com/lafactory
  • Gmail
  • https://www.linkedin.com/company/lafactory-inc

Dans la barre latérale de gauche, sélectionnez la base de données de votre site en direct. Vérifiez ensuite toutes les lignes de la table. Dans le menu déroulant, choisissez « Drop ». Cette opération supprime les tables de votre site en direct afin que nous puissions les remplacer par la base de données que nous avons téléchargée précédemment.

Dev Site to Live - Manual 12-14
  • https://www.facebook.com/lafactoryworld
  • https://twitter.com/lafactory
  • Gmail
  • https://www.linkedin.com/company/lafactory-inc

Confirmez votre choix de « supprimer » la table en cliquant sur Oui.

Dev Site to Live - Manual 15
  • https://www.facebook.com/lafactoryworld
  • https://twitter.com/lafactory
  • Gmail
  • https://www.linkedin.com/company/lafactory-inc

Ensuite, sélectionnez rapidement Importation dans le menu ci-dessus et cliquez sur Choisir le fichier.

Dev Site to Live - Manual 16-17
  • https://www.facebook.com/lafactoryworld
  • https://twitter.com/lafactory
  • Gmail
  • https://www.linkedin.com/company/lafactory-inc

Ensuite, suivez l’invitation à télécharger un fichier. Sélectionnez le fichier .sql que nous avons précédemment téléchargé et cliquez sur Ouvrir.

Dev Site to Live - Manual 18-19
  • https://www.facebook.com/lafactoryworld
  • https://twitter.com/lafactory
  • Gmail
  • https://www.linkedin.com/company/lafactory-inc

Pour terminer le téléchargement de la base de données, cliquez sur Go.

Dans cette base de données nouvellement téléchargée, vous devrez prendre note du préfixe des fichiers dans la barre latérale de gauche. Nous en aurons besoin dans une étape ultérieure.

Dev Site to Live - Manual 20
  • https://www.facebook.com/lafactoryworld
  • https://twitter.com/lafactory
  • Gmail
  • https://www.linkedin.com/company/lafactory-inc

Mettez à jour la base de données avec l’URL du site en ligne

Dans la même base de données, sélectionnez le tableau _options dans la barre latérale de gauche. Sous la liste des options disponibles, sélectionnez Editer sur l’option avec siteurl dans la colonne option_name. *Notez également le préfixe de la base de données pour plus tard.

Dev Site to Live - Manual 21-22
  • https://www.facebook.com/lafactoryworld
  • https://twitter.com/lafactory
  • Gmail
  • https://www.linkedin.com/company/lafactory-inc

Sous l’onglet Insertion dans les options siteurl de la table de base de données, nous voulons mettre à jour la valeur de l’option siteurl. Pour ce faire, remplacez l’URL existante du site de développement par l’URL du site réel dans la case de valeur à droite. Puis faites défiler vers le bas et cliquez sur Go/Done.

Dev Site to Live - Manual 23-24
  • https://www.facebook.com/lafactoryworld
  • https://twitter.com/lafactory
  • Gmail
  • https://www.linkedin.com/company/lafactory-inc

Une fois cela fait, retournez à la même liste d’options pour le tableau _options. Dans la liste des options disponibles, sélectionnez Editer sur l’option avec home dans la colonne option_name. Répétez ensuite le même processus que précédemment (pour le siteurl) et remplacez l’URL du site de développement de la valeur_option home par l’URL du site réel.

Dev Site to Live - Manual 25
  • https://www.facebook.com/lafactoryworld
  • https://twitter.com/lafactory
  • Gmail
  • https://www.linkedin.com/company/lafactory-inc

Mise à jour des fichiers du site (wp-content) sur le site réel

À ce stade, nous avons terminé le téléchargement et la configuration de notre base de données ! Mais, nous ne sommes pas encore sortis de l’auberge. Nous devons encore remplacer certains des fichiers du site Live par ceux du site dev.

Pour ce faire, retournez dans le cPanel du site Live, cliquez sur File Manager, choisissez le site Live et cliquez sur Go.

Dev Site to Live - Manual 26
  • https://www.facebook.com/lafactoryworld
  • https://twitter.com/lafactory
  • Gmail
  • https://www.linkedin.com/company/lafactory-inc

Cliquez sur le dossier wp-content, puis supprimez-le.

Dev Site to Live - Manual 27-28
  • https://www.facebook.com/lafactoryworld
  • https://twitter.com/lafactory
  • Gmail
  • https://www.linkedin.com/company/lafactory-inc

Ensuite, cliquez sur Upload dans le menu supérieur du gestionnaire de fichiers.

Dev Site to Live - Manual 29
  • https://www.facebook.com/lafactoryworld
  • https://twitter.com/lafactory
  • Gmail
  • https://www.linkedin.com/company/lafactory-inc

Cliquez sur Choose File. Sélectionnez ensuite le fichier wp-content.zip et cliquez sur Ouvrir.

Dev Site to Live - Manual 30-32
  • https://www.facebook.com/lafactoryworld
  • https://twitter.com/lafactory
  • Gmail
  • https://www.linkedin.com/company/lafactory-inc

Attendez qu’il soit téléchargé. Si le téléchargement est terminé mais que vous ne revenez pas à la structure du fichier, cliquez sur le lien Retourner à….

Dev Site to Live - Manual 33
  • https://www.facebook.com/lafactoryworld
  • https://twitter.com/lafactory
  • Gmail
  • https://www.linkedin.com/company/lafactory-inc

Trouvez et cliquez sur le fichier wp-content.zip que vous venez de télécharger et sélectionnez extraire dans le menu déroulant.

Dev Site to Live - Manual 34-35
  • https://www.facebook.com/lafactoryworld
  • https://twitter.com/lafactory
  • Gmail
  • https://www.linkedin.com/company/lafactory-inc

Dans la fenêtre popup Extraire, cliquez sur Extraire les fichiers. Une fois l’extraction terminée, vous pouvez supprimer le fichier wp-content.zip compressé, car il peut devenir confus si vous le faites souvent.

Dev Site to Live - Manual 36
  • https://www.facebook.com/lafactoryworld
  • https://twitter.com/lafactory
  • Gmail
  • https://www.linkedin.com/company/lafactory-inc

Mettez à jour le fichier wp-config.php pour le site en direct

Une fois le dossier wp-content en place, sélectionnez le fichier wp-config.php et cliquez sur modifier.

Dev Site to Live - Manual 37-38
  • https://www.facebook.com/lafactoryworld
  • https://twitter.com/lafactory
  • Gmail
  • https://www.linkedin.com/company/lafactory-inc

Recherchez le préfixe de table dans le document et remplacez-le par le préfixe des tables de la base de données du site de développement mentionné précédemment. Ensuite, il suffit de faire défiler le document et de cliquer sur Enregistrer

Voilà, c’est fait ! Consultez le site en ligne pour voir les modifications apportées par le site de développement WordPress.

Dev Site to Live - Manual 39-40
  • https://www.facebook.com/lafactoryworld
  • https://twitter.com/lafactory
  • Gmail
  • https://www.linkedin.com/company/lafactory-inc

Si c’était une étape de trop pour vous, de nombreuses sociétés d’hébergement modernes qui privilégient l’hébergement WordPress offrent des outils de mise en page/migration robustes (et faciles à utiliser).

Nous allons maintenant vous montrer comment Siteground facilite le transfert d’un site de développement vers un site réel.

Transférer un site de développement vers un site réel avec les outils de mise en scène de Siteground

Les hébergeurs spécialisés dans l’installation de WordPress ont amélioré la création d’outils permettant de pousser les sites de développement/staging vers un site réel. L’un de ces hébergeurs est Siteground, qui se trouve être l’un de nos partenaires d’hébergement Divi. Pour mettre en ligne un site de développement à l’aide de Siteground, vous devez avoir créé votre site de démonstration à l’aide des outils Site Tools de Siteground.

Une fois que votre site est opérationnel sur Siteground, connectez-vous à votre compte Siteground. Cliquez ensuite sur l’onglet Sites Web situé en haut de la page. Sélectionnez également le sous-onglet Sites Web. À partir de là, choisissez le site Web que vous avez en tête et qui est représenté par chaque case individuelle sur la page. Cliquez sur le bouton Outils du site de ce site.

Dev Push Live - Siteground - 1-4_num
  • https://www.facebook.com/lafactoryworld
  • https://twitter.com/lafactory
  • Gmail
  • https://www.linkedin.com/company/lafactory-inc

Dans le menu latéral de gauche, naviguez jusqu’à WordPress > Staging. À partir de là, sélectionnez le site réel exact que nous avons à l’esprit dans la section Sélectionner l’installation WordPress, qui est généralement une liste de sous-domaines pour le TLD particulier.

Dans la section « Manage Staging Copies », près du bas, trouvez la copie de mise en place que vous voulez déployer et cliquez sur l’icône à trois points (⋮) pour développer les options de la copie de mise en place. Sélectionnez Déploiement complet dans la liste pour déployer l’ensemble du site de mise à disposition. Vous pouvez également sélectionner Déploiement personnalisé si vous n’aviez qu’une partie du site de mise à disposition à déployer.

Dev Push Live - Siteground - 5-9_num
  • https://www.facebook.com/lafactoryworld
  • https://twitter.com/lafactory
  • Gmail
  • https://www.linkedin.com/company/lafactory-inc

Enfin, dans la popup de confirmation du déploiement, cliquez sur Confirmer.

Dev Push Live - Siteground - 10_num
  • https://www.facebook.com/lafactoryworld
  • https://twitter.com/lafactory
  • Gmail
  • https://www.linkedin.com/company/lafactory-inc

Après cela, tout est terminé ! Vous devriez voir un message de réussite dans le coin supérieur droit.

Dev Push Live - Siteground - 11 - End_num
  • https://www.facebook.com/lafactoryworld
  • https://twitter.com/lafactory
  • Gmail
  • https://www.linkedin.com/company/lafactory-inc

Si vous ne voyez pas le dialogue de réussite, vous pouvez contacter l’assistance Siteground pour résoudre le problème.

Que faire après la mise en ligne du site de développement ?

Nos trois méthodes pour pousser un site de développement WordPress vers un site en ligne sont toutes d’excellentes options. Mais, avec chacune d’entre elles, il y a des risques de casser temporairement votre site. En espérant que les étapes de cet article vous ont permis d’atteindre le résultat souhaité, voici ce qu’il faut faire lorsque vous avez terminé de pousser votre site de démonstration.

Une fois que vous avez terminé les étapes que vous avez choisi de suivre, ouvrez le site en direct et regardez ses pages. Assurez-vous que tout se charge et que tout est conforme à vos attentes. Ensuite, allez dans votre tableau de bord d’administration et connectez-vous. Vous ne devriez pas avoir d’erreur en vous connectant.

S’il semble y avoir des problèmes de base de données, vous devez les résoudre rapidement. Vous pouvez consulter notre article Comment corriger une erreur de connexion à la base de données pour trouver des zones communes à revérifier. En cas de problème, vous pouvez revenir à la sauvegarde que vous avez créée avant de commencer et recommencer les étapes.

  • Vérifiez les versions www et non-www du site ainsi que les versions HTTPS et HTTP. (Les redirections se produisent-elles comme prévu ?)
  • Vérifiez les liens de la navigation principale ainsi que les pages dynamiques telles que les catégories, les articles et les types d’articles personnalisés. (Les modifications les plus récentes du site de développement sont-elles sur votre site réel ?)
  • Assurez-vous que les images s’affichent correctement sur les pages récemment mises à jour.
  • Contrôlez quotidiennement les liens brisés 404 pendant quelques jours.

Quelle méthode utiliser ?

Chacune des trois méthodes présentées dans cet article peut faire l’affaire. Cependant, en fonction de votre site ou de votre hébergeur, certaines options seront plus adaptées que d’autres. Voici quelques suggestions :

  • Si votre hébergeur dispose d’outils de staging, il vaut la peine d’apprendre à les utiliser. Ces outils rendent le travail aussi facile qu’il peut l’être.
  • Les plugins de migration/staging sont la meilleure solution suivante. Les versions Pro coûtent un peu d’argent mais elles feront l’affaire à chaque fois.
  • La migration manuelle d’un site de développement vers un site réel n’est certainement pas la meilleure solution pour les débutants, car elle demande plus de temps et de connaissances techniques et peut aboutir à la destruction de votre site. Cependant, si vous savez ce que vous faites, cette méthode vous permet de mieux contrôler le processus, ce que préfèrent certains développeurs.

Conclusion

Savoir comment migrer un site de test vers votre site réel est une compétence importante à posséder. Cela vous donne une plus grande liberté d’expérimentation sur vos sites sans craindre de faire tomber le site actif sur lequel vos visiteurs se trouvent. Que vous gériez vos propres sites ou ceux de vos clients, savoir comment pousser les mises à jour fait de vous un webmaster beaucoup plus fiable.