Comment modifier le footer WordPress

Parmi la myriade de systèmes de gestion de contenu WordPress constitue sans aucun doute le CMS le plus fré­quem­ment utilisé. Un site WordPress est constitué de plusieurs éléments :

• Le core de WordPress : l’ins­tal­la­tion WordPress
• Le thème : une structure basique pour afficher du contenu dynamique
• Les plugins : pour dé­ve­lop­per la fonc­tion­na­lité centrale de WordPress
• Le contenu : créé par le pro­prié­taire et stocké dans la bi­blio­thèque média

Pour créer un site WordPress couronné de succès, de petits chan­ge­ments se révèlent souvent in­dis­pen­sables. L’in­té­gra­tion de scripts externes constitue l’un des chan­ge­ments les plus courants que les uti­li­sa­teurs peuvent réaliser. Souvent, ces scripts ont besoin d’être intégrés dans le footer WordPress. Nous allons vous montrer comment le processus fonc­tionne et à quoi il faut faire attention.

En général, un footer se trouve en bas d’une page. Le footer signale au visiteur qu’il est arrivé à la fin de la page. Le footer WordPress contient deux types d’éléments, que nous allons examiner plus en détails ci-dessous.

1. Des éléments visibles
2. Des éléments in­vi­sibles

Con­trai­re­ment à un header WordPress, le footer WordPress contient souvent des éléments visibles se­con­daires et moins mis en avant. Ceci est cohérent dans la mesure où le header est la première chose qu’un visiteur voit en arrivant sur une page. Un header bien construit peut aussi agir comme un aimant et faire en sorte que les visiteurs restent consulter une page plus longtemps. Le footer contient en général les éléments suivants :

• Des liens vers d’autres pages telles que la politique de con­fi­den­tia­lité, les in­for­ma­tions de contact, etc.
• La notice de propriété in­tel­lec­tuelle
• Un lien pour remonter en haut de la page

À la dif­fé­rence du footer WordPress, le header comprend plusieurs balises méta. La plupart de celles-ci doivent être incluses dans l’élément de tête HTML. Cependant, les mé­ta­don­nées ont tendance à être utilisées en-dehors de l’en-tête HTML. Surtout, des éléments de script divers tendent à être utilisés. Ceux-ci sont intégrés dans le footer WordPress.

Une des ca­rac­té­ris­tiques par­ti­cu­lières des fichiers de script externes est que lorsqu’ils sont intégrés dans l’en-tête HTML, les fichiers script bloquent le char­ge­ment de la page. Par con­sé­quent, la re­com­man­da­tion tra­di­tion­nelle était de placer les éléments script externes avant la balise de fermeture </body> aussi souvent que possible. Dans WordPress, ceci revient à les intégrer dans le footer.

Mais nous devons établir quelques dis­tinc­tions lorsque nous parlons de scripts. Les scripts peuvent être chargés depuis un fichier externe, mais ils peuvent également être intégrés dans une page. De plus, les éléments scripts se voient désormais attribuer un éventail beaucoup plus large de fonctions. L’attribut « type » est utilisé pour décrire le type des données intégrées. À cet égard, les données d’ap­pli­ca­tion et les mé­ta­don­nées peuvent être intégrées sur une page unique. Ci-dessous, vous trouverez un aperçu des éléments scripts fré­quem­ment utilisés :

Il y a deux manières de placer du contenu ad­di­tion­nel dans un footer WordPress :

1. Utiliser un plugin
2. Modifier le code thème

Chacune de ces méthodes a des avantages et des in­con­vé­nients qui peuvent être résumés ainsi :

Un thème WordPress constitue la structure de base pour afficher le contenu d’un site WordPress. Modifier le thème vous assure un contrôle total sur le footer ; des éléments visibles comme in­vi­sibles peuvent être ajoutés, supprimés et modifiés.

Ci-dessous, nous allons nous con­cen­trer sur les éléments in­vi­sibles, compte tenu du fait que les mo­di­fi­ca­tions apportées aux éléments visibles dépendent gé­né­ra­le­ment du thème que vous avez utilisé, ce qui né­ces­si­te­rait l’inclusion de feuilles de style pour étayer nos ex­pli­ca­tions. Il existe une exception : si vous êtes versé dans l’art du HTML et du PHP, vous pouvez aisément retirer un élément.

Lorsque vous voulez apporter des chan­ge­ments à un thème, cela vaut la peine de créer un a href="t3://page?uid=2815">thème enfant, ce qui garantit que les chan­ge­ments protégées contre les mises à jour et peuvent être fa­ci­le­ment annulées si né­ces­saire. Les bénéfices com­pen­sent l’effort lé­gè­re­ment supérieur à réaliser.

Vous pouvez modifier le footer WordPress ainsi :

1. Modifier le code dans le fichier modèle footer.php
2. Créez des fonctions ad­di­tion­nelles dans functions.php

Pour commencer, jetons un coup d’œil à la structure générale d’une page HTML moderne. De nombreux thèmes WordPress suivent cette tendance, avec quelques légères va­ria­tions. Nous pointons les tendances spé­ci­fiques à WordPress dans les com­men­taires ;

Un document HTML est constitué de deux éléments <head> et <body>. Dans notre exemple, l’élément <body> contient les éléments <header>, <main>, et <footer>. Dans un thème WordPress, cette structure d’élément est dis­tri­buée à travers plusieurs fichiers modèles. L’immense majorité des thèmes utilisent les fichiers header.php et footer.php pour encoder le header ou le footer.

La manière la plus rapide de modifier le footer WordPress est sans doute de modifier le fichier modèle « footer.php ». Jetons un œil au thème WordPress « Twen­tyT­wenty » pour illustrer comment un fichier footer.php typique est structuré. Veuillez noter que le code ci-dessous a été raccourci.

1. Le footer.php commence avec une balise d’ouverture
2. Celle-ci est suivie par des éléments visibles et la balise de fermeture .
3. Ensuite, le Hook WordPress wp_footer est appelé.

Des éléments ad­di­tion­nels sont insérés de manière dynamique (nous verrons cela plus loin dans ce guide).

1. Enfin, les balises </body> et </html> suivent.

Vous vous aper­ce­vrez que le footer WordPress dans le thème Twenty Twenty contient le texte « Powered by WordPress ». Retirez cela du footer.php en modifiant le fichier. Il vous suffit pour cela d’utiliser le code suivant :

Une fois les lignes de code per­ti­nentes sup­pri­mées et le fichier en­re­gis­tré, le texte sur la page ne s’affiche plus. Mais attention ! Le footer WordPress est intégré sur chaque page. Les erreurs faites lorsque vous adaptez le code peuvent affecter la totalité de votre site. Assurez-vous d’effectuer une copie de votre fichier avant de commencer.

Souvent, il est plus facile et moins risqué d’ajouter une ligne de CSS au lieu de modifier le code PHP. Néanmoins, cela ne fonc­tionne que si le code thème est propre. En ce qui concerne le thème Twen­tyT­wenty, vous pouvez dis­si­mu­ler le texte avec le code CSS suivant :

Le fichier functions.php constitue un fichier de thème spécial qui contient du code pour per­son­na­li­ser le thème et le site WordPress. De plus, il fait office de point d’entrée pour l’injection dynamique de code dans le footer WordPress. Le Hook wp_footer est lié à des fonctions définie de manière spé­ci­fique : si le Hook fonc­tionne, les fonctions sont exécutées. Jetons un coup d’œil à ces quelques exemples.

Pour commencer, nous intégrons un bloc avec des mé­ta­don­nées de balise de script sur la page d’accueil WordPress. Pour ce faire, nous ajoutons le code suivant en format JSON-LD à functions.php :

Dans l’exemple suivant, nous voulons ajouter un élément de script avec des données JSON uni­que­ment sur les pages où les com­men­taires sont activés. Imaginons que nous sou­hai­tions cacher les com­men­taires à des uti­li­sa­teurs spé­ci­fiques ou dans un cadre de temps spé­ci­fique. Nous ajoutons le nom de l’uti­li­sa­teur et l’année sur les pages tels que :

L’in­té­gra­tion de scripts externes constitue l’un des chan­ge­ments les plus courants fait à un footer WordPress. Il est rarement opportun d’exclure des fichiers scripts externes via un plugin ou en modifiant le footer.php. À la place, vous devriez utiliser la fonc­tion­na­lité spé­ci­fique fournie par WordPress. La fonction wp_enqueue_script () et le Hook wp_enqueue_script sont utilisés pour réaliser les chan­ge­ments dans functions.php.

Utiliser les fonctions spé­ci­fiques de WordPress pour intégrer des scripts externes présente plusieurs avantages :

• Vous pouvez définir le fait que Script A ne charge qu’une fois que Script B a chargé. Cette étape garantit le fait que les dé­pen­dances sont atteintes.
• Vous pouvez spécifier qu’un script doit ap­pa­raître dans le footer WordPress. À titre al­ter­na­tif, le script se re­trou­vera dans l’en-tête HTML.
• Vous pouvez ajouter un numéro de version explicite pour un script. Celui-ci sera ajouté à l’URL du script. Si la version change, le script se verra assigner un nouvel URL. Ceci force le script à se recharger plutôt que d’utiliser l’ancienne version depuis un cache.
• Vous pouvez définir les scripts que vous voulez inclure et de quelle manière. WordPress s’occupe du reste. Il s’agit d’une étape es­sen­tielle pour optimiser les per­for­mances. Par exemple, un plugin de mise en cache peut prendre en charge la liste des scripts à intégrer et les traiter. Les tech­niques d’op­ti­mi­sa­tion fré­quem­ment utilisées telles que la « mi­ni­fi­ca­tion » et la « con­ca­té­na­tion » sont basées sur ce mécanisme.

Voyons en détail comment la fonction wp_enqueue_script() est struc­tu­rée. Voici le script basique avec lequel appeler la fonction avec tous ses pa­ra­mètres :

Ci-dessous, vous trouverez un résumé de la fonction wp_enqueue_script () et des ex­pli­ca­tions sur ses pa­ra­mètres, ainsi qu’un exemple :

Enfin, voici comment l’exemple dans le tableau se traduit sous forme de code. Si nous entrons le code suivant dans le fichier functions.php, notre script sera chargé comme une dé­pen­dance sur jQuery. Le numéro de la version de l’ins­tal­la­tion WordPress est ajouté en tant que version à l’URL du script. Le script est intégré au footer WordPress.