Bien que WordPress soit reconnu pour son environnement relativement stable, où les erreurs sont moins fréquentes que dans le développement logiciel traditionnel, des problèmes peuvent toujours surgir.
En général, plus un outil offre de flexibilité, plus le risque d’erreurs potentielles augmente.
Dans le cas de WordPress, cette flexibilité est importante, et par conséquent, le risque d’erreurs aussi. L’architecture ouverte des plugins permet d’ajouter des fonctionnalités au CMS, mais il faut aussi considérer le serveur web, l’hébergeur, le système de gestion de base de données, et le réseau. Tous ces éléments indépendants peuvent causer des soucis.
Les problèmes rencontrés peuvent inclure des performances lentes, des contenus altérés ou incorrects, des messages d’erreur, et le pire : l’écran blanc de la mort (WSoD), indiquant que votre site web est hors service et nécessite une intervention immédiate.
Même un léger ralentissement, comme un délai de moins de deux secondes, doit vous alerter, car cela peut impacter votre référencement et votre position dans les résultats de recherche. Cela se traduit par une diminution du nombre de visiteurs, car de nos jours, la rapidité est primordiale, surtout pour les utilisateurs mobiles.
Il est donc essentiel d’avoir des outils pour agir dès que vous sentez que votre site web ne fonctionne pas correctement. Même si c’est le cas, il est toujours possible d’améliorer ses performances et son ergonomie.
Qu’est-ce que le débogage ?
Le débogage est le processus par lequel les développeurs détectent et corrigent les erreurs (ou « bugs ») dans leurs programmes. Cela se fait à l’aide d’outils spécialisés permettant de visualiser ce qui se passe à l’intérieur d’un programme en cours d’exécution.
Parfois, la partie la plus complexe du débogage consiste à identifier précisément le composant, la commande ou l’instruction qui cause l’erreur. Pour cela, les développeurs agissent comme un médecin qui doit poser un diagnostic : ils analysent les symptômes et effectuent des investigations pour trouver l’origine du problème. En développement logiciel, les outils de surveillance qui analysent le fonctionnement interne d’un site web sont l’équivalent de ces investigations médicales.
Examinons quelques options.
WP_DEBUG
WordPress dispose d’une aide au débogage intégrée souvent négligée. Il s’agit d’un paramètre nommé WP_DEBUG qui active le mode de débogage dès qu’il est activé. Quand WP_DEBUG est enclenché, un journal est généré, enregistrant toute l’activité de votre site. En étudiant ce journal, vous pourriez découvrir ce qui ne fonctionne pas correctement sur votre site WordPress.
Pour activer WP_DEBUG, il faut modifier le fichier wp-config.php en y ajoutant les lignes nécessaires pour ordonner à votre site web de consigner toutes les activités. Cette manipulation n’est pas à la portée de tous : il faut être très prudent lors de l’édition du fichier wp-config.php, car une erreur de ligne ou de caractère peut rendre votre site inopérant. Il est impératif de faire une sauvegarde de votre site et de vos fichiers avant toute action. En cas d’erreur, vous pourrez restaurer la sauvegarde et revenir à un état normal.
Pour modifier le fichier wp-config.php, utilisez le gestionnaire de fichiers de votre hébergeur ou un client FTP pour télécharger le fichier et l’ouvrir localement avec votre éditeur de texte préféré. Le fichier se trouve dans le répertoire principal de votre installation WordPress. Après l’avoir ouvert, cherchez la ligne où WP_DEBUG est définie. Elle devrait ressembler à ceci:
define( 'WP_DEBUG', false );
Si cette ligne n’existe pas, cherchez le commentaire suivant:
/* That’s all, stop editing! Happy blogging. */
et ajoutez les lignes suivantes au-dessus de ce commentaire. Ces commandes indiqueront à votre site de consigner toutes les erreurs sans les afficher, ce qui est utile pour les sites web publics:
define('WP_DEBUG', true);
define('WP_DEBUG_LOG', true);
define('WP_DEBUG_DISPLAY', false);
@ini_set('display_errors',0);
Enregistrez le fichier modifié et, si vous utilisez FTP, téléchargez-le sur votre site. Tentez ensuite de reproduire l’erreur (ou attendez qu’elle se produise) et vérifiez le fichier debug.log. Vous le trouverez dans le dossier wp-content de votre installation WordPress. Vous pouvez l’ouvrir avec un éditeur de texte et rechercher les messages d’erreur qui révèlent ce qui cause des soucis à votre site web.
Après cela, il est indispensable de désactiver la journalisation en remplaçant les valeurs « true » par « false » dans toutes les lignes ajoutées ou modifiées dans le fichier wp-config.php.
Rapport d’erreurs WPDB
Si vous suspectez ou savez que la base de données de votre site web cause des problèmes, vous pouvez activer le rapport d’erreurs WPDB. Cette opération exige également un peu de codage. Une fois le rapport d’erreurs activé, vous pouvez demander à votre site d’afficher les erreurs de base de données à l’écran.
Il n’est pas recommandé de le faire sur un site web en production, sauf si l’affichage de messages d’erreur à vos visiteurs ne vous pose pas problème. Il est préférable d’utiliser un site web de pré-production (comme décrit ci-dessous) où vous pouvez effectuer tous les tests sans exposer ce qui se passe en coulisses.
La lecture de ces rapports ou journaux d’erreurs nécessite des connaissances techniques, tout comme il faut des compétences médicales pour interpréter une radiographie. Vous devrez déchiffrer du jargon lié à la programmation, aux réseaux ou aux bases de données. Toutefois, cela vous permettra probablement de trouver la cause du problème, et d’obtenir l’aide d’une personne capable de résoudre ce problème spécifique.
Pour commencer à générer des rapports d’erreur de base de données, ajoutez la ligne suivante à votre fichier wp-config.php (de la même manière que pour le journal de débogage):
define( 'SAVEQUERIES', true);
En définissant cette valeur sur « true », la base de données commencera à enregistrer toutes les requêtes effectuées par votre site web. Ensuite, vous pourrez examiner le nombre de requêtes générées par chaque requête de page et les commandes utilisées dans chacune d’elles. Une façon d’afficher les requêtes à l’écran consiste à ajouter ces lignes dans votre fichier PHP de thème au sein de votre flux d’exécution:
global $wpdb; print_r( $wpdb->queries );
Après le débogage, vous devez supprimer ces lignes pour que votre site web retrouve son fonctionnement habituel.
Utiliser un site de développement
Un site web de pré-production est une copie conforme de votre site web actuel, où vous pouvez tester les modifications ou les nouvelles fonctionnalités avant de les mettre en ligne. C’est également une excellente méthode pour déboguer des problèmes ou surveiller le comportement de votre site, car cela vous permet de tester sans perturber les utilisateurs réels de votre site.
Il est primordial qu’un site de pré-production soit un reflet exact du contenu et de la structure de votre site web actuel. À chaque mise à jour de votre site WordPress (contenu ou extensions, principalement plugins et thèmes), vous devez rafraîchir votre site de pré-production avec une copie du site actuel. De cette façon, si un problème survient sur votre site web en ligne, vous pourrez le reproduire dans votre environnement de pré-production.
De nombreux hébergeurs WordPress proposent un site de pré-production comme avantage inclus dans leurs offres payantes. C’est la méthode la plus simple pour disposer d’un environnement où vous pouvez tester des choses en toute sécurité. Si votre hébergeur ne propose pas cette option, vous pouvez créer un site de pré-production à l’aide du plugin WP Staging. Ce plugin facilite le clonage de votre site web et son utilisation comme s’il s’agissait du site réel. Vous serez toujours conscient que vous êtes dans un environnement de pré-production grâce à une barre orange située en haut de l’écran.
Si vous préférez faire les manipulations vous-même, vous pouvez créer manuellement un site de pré-production sur un sous-domaine, à condition que votre hébergeur vous permette d’ajouter un sous-domaine à votre compte. La création du site de pré-production par cette méthode peut être un peu compliquée, donc si vous êtes novice avec WordPress, vous préférerez peut-être une autre approche.
Moniteur de requêtes
Son nom pourrait être trompeur, car Query Monitor fait bien plus que surveiller les requêtes. C’est un panneau de développement complet pour WordPress, permettant le débogage de scripts, feuilles de style, appels d’API, requêtes de base de données, erreurs PHP, etc. Certaines fonctionnalités avancées permettent de déboguer les appels Ajax et de vérifier les droits d’utilisateur.
Une fois installé et activé, Query Monitor affiche des informations sur le comportement de votre site web de la manière la plus utile.
Par exemple, il affiche les requêtes de base de données agrégées, classées par les fonctions, plugins ou thèmes qui les ont déclenchées. Un menu dans la barre d’outils d’administration présente des statistiques en direct de la page actuelle, avec toutes les informations de débogage nécessaires pour évaluer le problème que vous cherchez à résoudre.
Grâce à Query Monitor, vous pouvez progressivement affiner votre recherche de bugs par plugin ou thème, jusqu’à trouver celui qui dégrade les performances de votre site web ou qui provoque un dysfonctionnement. Tout comme WordPress, Query Monitor est entièrement gratuit et open-source.
Autrefois connu sous le nom de Firebug, les outils de développement Firefox sont une version de Firefox conçue pour les développeurs, offrant les dernières fonctionnalités et outils de développement. Bien que non spécifique à WordPress, cet outil s’avère très utile pour le débogage de sites web.
Il est inévitable de comparer les outils de développement Firefox avec les outils de développement Chrome, qui sont très populaires. La mise en page de Firefox se démarque. Par exemple, vous pouvez faire un clic droit sur n’importe quel élément pour afficher l’onglet Inspecteur, et la console web offre une sortie riche lors de l’impression d’objets, affichant beaucoup plus d’informations que son nom ne le suggère. Il fournit des informations supplémentaires pour certains types, permettant un examen détaillé des propriétés de l’objet et des informations plus riches pour les éléments DOM.
Avec l’outil Inspecteur, vous pouvez examiner et modifier les pages HTML et CSS, et ce aussi bien avec des pages chargées localement dans Firefox que sur un appareil distant, tel que Firefox pour Android.
La console web affiche toutes les informations dont vous pourriez avoir besoin sur une page web : JavaScript, requêtes réseau, CSS, avertissements, messages d’erreur et messages d’information explicitement enregistrés par le code JavaScript. Elle permet également d’interagir avec une page web en exécutant directement des expressions JavaScript dans le contexte de la page.
New Relic
Acteur majeur du marché de l’APM (Application Performance Monitoring), New Relic est un produit commercial utilisé quotidiennement par des milliers de développeurs pour analyser les performances de leurs applications. Son architecture de plugin permet d’ajouter des fonctionnalités via des tiers, ce qui se traduit par une multitude de technologies pouvant être surveillées par cet outil.
Avec des prix variant de 9,37 $ à 200 $ par hôte et par mois, il s’adresse aux tâches de débogage professionnelles. L’apprentissage de son fonctionnement est assez long. En plus de l’investissement financier, il faut aussi investir du temps pour apprendre à l’utiliser. Les utilisateurs de New Relic apprécient sa simplicité d’intégration dans les outils d’APM et de surveillance des infrastructures.
Kinsta permet d’intégrer facilement New Relic à partir de son tableau de bord MyKinsta.
Barre de débogage
Debug Bar est un ensemble de plugins accessibles via un menu de débogage dans la barre d’administration de WordPress. Il affiche une grande variété d’informations de débogage. Ses options comprennent la console, les shortcodes, les constantes, les types de publication, cron, actions et filtres, transitoires, requêtes à distance et scripts de listes et dépendances de style. Ce plugin open-source est gratuit.
Le plugin principal, Debug Bar, fournit la fonctionnalité de base, étendue par les autres plugins. Il fonctionne avec les indicateurs de débogage intégrés proposés par WordPress, tels que WP_DEBUG et SAVEQUERIES. Lorsque ces indicateurs sont actifs, la barre de débogage ajoute des informations de débogage utiles, telles que des avertissements PHP et des requêtes MySQL, vous évitant ainsi de chercher dans les fichiers journaux.
Chaque option du menu de la barre de débogage offre des possibilités intéressantes pour le débogage. La console, par exemple, fournit un environnement où vous pouvez exécuter du code PHP, idéal pour tester le contenu des variables (entre autres utilisations). Cron affiche des informations sur les événements planifiés de WordPress, comme l’heure du prochain événement, le nombre d’événements planifiés, la liste des événements personnalisés, etc. Les actions et les filtres permettent d’afficher les hooks liés à la requête en cours. L’onglet Actions affiche les actions relatives à la requête en cours, tandis que l’onglet Filtres affiche tous les tags de filtre, ainsi que les fonctions associées à chacun.
Débogage pour tous
Les outils de débogage sont principalement conçus pour les professionnels du développement logiciel. Mais même si vous n’êtes pas développeur et que vous vous contentez de tenir un blog WordPress, il est utile d’avoir au moins une connaissance de base sur la façon de surveiller et de déboguer votre site. Cela permettra à un développeur de trouver la source d’un problème plus facilement. De la même manière, si vous vous sentez mal, vous facilitez la tâche de votre médecin en prenant vous-même votre température avant d’aller le voir.
Découvrez quelques méthodes pour gagner de l’argent en tant que professionnel WordPress.