Tutoriels WordPress de confiance, quand vous en avez le plus besoin.
Guide du débutant pour WordPress
WPB Cup
25 millions+
Sites web utilisant nos plugins
16+
Années d'expérience WordPress
3000+
Tutoriels WordPress par des experts

Comment ajouter du code dans l'en-tête et le pied de page de WordPress (la méthode facile)

Chez WPBeginner, nous créons de nombreux tutoriels qui nécessitent d'insérer du code dans les sections <header> ou <footer> de votre site WordPress. Pour de nombreux utilisateurs, cela peut sembler intimidant, d'autant plus que WordPress ne dispose pas d'un moyen intégré pour insérer du code dans ces zones.

Cependant, l'ajout de code à votre en-tête et à votre pied de page est essentiel pour intégrer des services populaires tels que Google Analytics, Google Search Console, le pixel Facebook, et plus encore. Vous pourriez également avoir besoin d'ajouter du CSS ou du JavaScript personnalisé dans le cadre d'autres tutoriels WordPress.

La bonne nouvelle ? Vous n'avez pas besoin de modifier directement les fichiers de votre thème ni de craindre de casser votre site. En utilisant le plugin gratuit WPCode, même les débutants peuvent ajouter en toute sécurité et facilement des extraits de code à leur en-tête ou à leur pied de page.

Dans ce guide, nous vous expliquerons comment ajouter du code dans l'en-tête et le pied de page de WordPress, étape par étape.

Comment ajouter du code d'en-tête et de pied de page dans WordPress

La meilleure façon d'ajouter du code dans l'en-tête et le pied de page de WordPress

Si vous souhaitez ajouter du code dans l'en-tête et le pied de page de WordPress, trois solutions s'offrent à vous :

  1. Manuellement, en modifiant les fichiers header.php et footer.php de votre thème
  2. Avec la fonctionnalité intégrée de votre thème pour le code d'en-tête et de pied de page
  3. En utilisant un plugin WordPress pour les en-têtes et les pieds de page

La première option n'est pas adaptée aux débutants car elle vous oblige à ajouter le code de l'en-tête et du pied de page en modifiant directement manuellement les fichiers header.php et footer.php.

Un autre inconvénient de cette méthode est que votre code sera supprimé si vous installez une mise à jour de votre thème.

La deuxième option consiste à utiliser la fonctionnalité intégrée de votre thème. Certains thèmes WordPress comme Elegant Themes offrent une option intégrée pour ajouter rapidement du code et des scripts à l'en-tête et au pied de page de votre WordPress.

Si vous utilisez un thème avec une fonctionnalité intégrée, cela semble être une solution sûre et simple. Cependant, si vous changez de thème, tous les extraits de code ajoutés à votre site web disparaîtront. Cela inclut la vérification du site dans Google Search Console, l'analyse du site web via Google Analytics, etc.

C'est pourquoi nous recommandons toujours aux utilisateurs d'utiliser la troisième option, un plugin d'en-têtes et de pieds de page. Cette option est de loin la méthode la plus simple et la plus sûre pour ajouter du code d'en-tête et de pied de page dans WordPress.

Suite à de nombreuses demandes de nos lecteurs, notre équipe a développé le plugin WPCode.

WPCode

WPCode (anciennement appelé Insert Headers and Footers) est un plugin d'extraits de code 100% gratuit. Vous pouvez l'utiliser pour ajouter facilement du code à l'en-tête et au pied de page dans WordPress.

Voici quelques avantages de l'utilisation du plugin WPCode :

1. 🚀 Facile, Rapide et Organisé : Il vous permet d'ajouter du code à l'en-tête et au pied de page de votre site facilement et rapidement. De plus, il vous permet de tout organiser en stockant tous vos codes d'en-tête et de pied de page en un seul endroit.

2. ✅ Empêche les erreurs : La validation intelligente des extraits de code permet d'éviter les erreurs qui pourraient survenir si vous modifiez manuellement les fichiers de votre thème.

3. 😌 Mettez à niveau ou changez votre thème sans souci : Le plugin enregistrera votre code d'en-tête et de pied de page dans un endroit séparé, vous permettant ainsi de mettre à jour ou de changer de thème sans craindre que le code ne soit effacé.

Outre les scripts d'en-tête et de pied de page, vous pouvez également utiliser WPCode pour insérer facilement des extraits de code PHP personnalisés, JavaScript, CSS, HTML et texte sans modifier les fichiers de votre thème.

De plus, WPCode dispose d'une bibliothèque d'extraits intégrée où vous pouvez trouver tous les extraits de code WordPress les plus utiles. Cela vous permet de supprimer rapidement les fonctionnalités WordPress dont vous ne voulez pas, comme les mises à jour automatiques, l'API REST, XML-RPC, les commentaires, et plus encore.

Remarque : Le plugin gratuit WPCode a tout ce dont vous avez besoin pour ajouter du code d'en-tête et de pied de page dans WordPress. Cependant, si vous souhaitez des fonctionnalités avancées comme une bibliothèque d'extraits dans le cloud privé, des pixels de conversion, des extraits planifiés, et plus encore, vous pouvez passer à WPCode Pro.

Pour plus de détails, lisez notre guide sur comment ajouter facilement du code personnalisé dans WordPress.

Cela dit, voyons comment ajouter facilement du code d'en-tête et de pied de page dans WordPress en utilisant le plugin WPCode.

Ajouter du code à l'en-tête et au pied de page dans WordPress

La première chose à faire est d'installer et d'activer le plugin gratuit WPCode. Pour plus de détails, consultez notre guide étape par étape sur comment installer un plugin WordPress.

Une fois le plugin activé, allez dans Snippets de code » En-tête & Pied de page depuis votre panneau d'administration WordPress. Ensuite, vous verrez une boîte « En-tête » où vous pourrez ajouter votre code.

Ajouter du code dans l'en-tête et le pied de page avec WPCode

Si vous faites défiler vers le bas, vous verrez également une boîte « Corps » et une boîte « Pied de page ».

Zones de scripts d'en-tête et de pied de page WPCode

Collez simplement le code dans l'une des trois boîtes. Une fois que vous avez terminé, n'oubliez pas de cliquer sur le bouton « Enregistrer les modifications » pour sauvegarder vos paramètres.

Le plugin chargera désormais automatiquement le code dans les emplacements respectifs sur votre site WordPress.

Vous pouvez toujours modifier et supprimer tout code que vous ne souhaitez pas conserver.

Vous devrez garder le plugin installé et activé en permanence. La désactivation du plugin arrêtera l'ajout de tout code personnalisé à votre site.

Si vous désactivez accidentellement le plugin, le code sera toujours stocké en toute sécurité dans votre base de données WordPress. Vous pouvez simplement réinstaller ou réactiver le plugin, et le code recommencera à apparaître.

Remarque : Vous devrez peut-être vider votre cache WordPress après avoir enregistré les modifications, afin que le code apparaisse correctement sur le front-end de votre site Web.

Nous avons trouvé la raison principale pour laquelle de nombreux débutants utilisent le plugin WPCode est d'ajouter Google Analytics à leur site Web. Pour cela, nous recommandons en fait d'utiliser le plugin gratuit MonsterInsights.

MonsterInsights est le meilleur plugin Google Analytics pour WordPress. Il vous aide à configurer correctement le suivi Google Analytics en quelques clics, et il vous montre des statistiques utiles directement dans votre tableau de bord WordPress.

Pour des instructions étape par étape, consultez ce tutoriel sur comment installer Google Analytics dans WordPress.

Tutoriel vidéo

Si vous n'aimez pas suivre des instructions écrites, vous pouvez regarder notre tutoriel vidéo sur la façon d'ajouter du code d'en-tête et de pied de page dans WordPress :

S'abonner à WPBeginner

Nous espérons que cet article vous a aidé à apprendre comment ajouter facilement du code d'en-tête et de pied de page dans WordPress. Vous pourriez également consulter notre guide sur comment afficher du code sur votre site WordPress, ou notre sélection d'experts des meilleurs outils de développement WordPress.

Si cet article vous a plu, abonnez-vous à notre chaîne YouTube pour des tutoriels vidéo WordPress. Vous pouvez également nous retrouver sur Twitter et Facebook.

Avis : Notre contenu est financé par nos lecteurs. Cela signifie que si vous cliquez sur certains de nos liens, nous pouvons percevoir une commission. Voir comment WPBeginner est financé, pourquoi c'est important et comment vous pouvez nous soutenir. Voici notre processus éditorial.

La boîte à outils WordPress ultime

Accédez GRATUITEMENT à notre boîte à outils - une collection de produits et de ressources liés à WordPress que tout professionnel devrait posséder !

Interactions des lecteurs

267 CommentsLeave a Reply

  1. Adsense me donne un code à copier sur mon site (entre head), où puis-je mettre le code sur mon site ?? J'utilise le plan premium !

  2. Bonjour,

    Votre membre d'équipe a essayé de résoudre mon problème et ils sont à l'heure... mais je viens de voir cet endroit où nous pouvons laisser une réponse.

    J'essaie d'ajouter une balise meta à ma page d'accueil comme requis par ma société de programme d'affiliation pour pouvoir promouvoir leur produit. J'ai utilisé le plugin 'add header and footer' comme suggéré par votre membre d'équipe et après avoir ajouté et sauvegardé les modifications, je ne vois pas les modifications... comment le site va-t-il apparaître après l'ajout de la balise meta, d'ailleurs la balise meta est comme suit

    OU l'autre option est d'ajouter une nouvelle page avec leur code qui est .html. J'ai essayé de copier-coller comme mais ça reste tel quel. EST-CE PARCE QUE MON SITE EST COMPATIBLE PHP ET QUE LE CODE EST HTML OU COMMENT ?

    J'espère recevoir vos conseils et commentaires.

    • Salut Madhusudan,

      Les balises meta se trouvent dans le code HTML de votre site web. Elles sont ajoutées dans la section header ou à la fin. Les balises meta ne sont pas visibles sur votre site web et ne modifient pas l'apparence de votre site web. Vous pouvez toujours voir la balise meta en visualisant la source ou en utilisant l'outil d'inspection.

      Admin

  3. J'ai ajouté le plugin header/footer. J'ai ajouté mon code de pixel Facebook et j'ai cliqué sur enregistrer. Mais comment installer ce code sur des pages spécifiques de mon site web afin de pouvoir suivre certaines conversions ?

  4. J'utilise ce plugin tout le temps sans problème. Aujourd'hui, je l'ai installé et ajouté mon code nécessaire dans la zone correcte. Chaque page affiche le code sauf la page d'accueil. Une idée pourquoi chaque page aurait le code sauf la page d'accueil ?

  5. Ce post n'explique pas quel script mettre dans le pied de page. Quel script simple puis-je utiliser pour commencer ? Je veux juste un pied de page simple.

  6. J'ai un problème ici. Il serait très utile de votre part de résoudre mon problème.
    Je dois ajouter le code de Google AdSense dans l'en-tête de mon site Web, mais j'avais auparavant ajouté le code des articles instantanés dans l'en-tête, que dois-je faire maintenant pour les conserver tous les deux ?
    (Comme je suis débutant, je n'y connais pas grand-chose. Aidez-moi s'il vous plaît.)

  7. J'ai essayé d'installer "Insert Headers and Footers" sur mon site Web. Lorsque je vais dans "Settings/Insert Headers and Footers", j'obtiens cette erreur : (Fatal error: Call to undefined function wp_unslash() in /home/afvetrep/public_html/wp-content/plugins/insert-headers-and-footers/ihaf.php on line 169)
    Que dois-je faire ?

    • Salut George,

      wp_unslash() est une fonction standard du cœur de WordPress depuis WordPress 3.6. Si vous utilisez une version plus ancienne de WordPress, vous devez mettre à jour WordPress.

      Si vous utilisez la dernière version de WordPress et que vous voyez toujours cette erreur, faites-le nous savoir et nous vous aiderons à résoudre le problème.

      Admin

  8. Bonjour. J'insère un script de popup MailChimp dans le pied de page et cela casse ma navigation principale WP. Avez-vous une idée pourquoi ou comment le réparer ? Je viens de mettre à jour vers votre dernière version du plugin mais le problème persiste. Merci.

  9. S'il vous plaît, aidez-moi
    Je ne vois aucun éditeur dans l'apparence..
    Je dois insérer le code méta de vérification de l'outil pour les webmasters. Comment puis-je modifier l'en-tête ?
    Besoin d'aide

  10. Merci beaucoup. S'il vous plaît, où puis-je coller le code Google AdSense dans ce plugin, en-tête ou pied de page ?

  11. Bonjour, je ne vois rien
    J'essaie de connecter mon WB avec Adsense

    Puis-je ajouter du code publicitaire Adsense sur WordPress après l'utilisation du mobile ???
    S'il vous plaît, aidez-moi

  12. Bonjour, peut-on encore l'utiliser pour insérer le code que l'on reçoit pour la vérification d'un compte Google Adsense ?

  13. C'est l'un de mes meilleurs plugins et je l'utilise fréquemment pour ajouter des codes à l'en-tête et au pied de page, mais quelque chose s'est passé après la mise à jour des plugins il y a quelques heures, cela a donné une erreur [Erreur fatale : Impossible d'utiliser la valeur de retour de la fonction dans le contexte d'écriture dans /home/campmmcg/public_html/wp-content/plugins/insert-headers-and-footers/ihaf.php à la ligne 102]

    S'il vous plaît, résolvez ceci

  14. C'était vraiment facile mais cela a changé mon en-tête sur le site web et il est énorme ! Cela a repoussé mon curseur et mon contenu pour une énorme boîte blanche. Au secours !

  15. salut merci pour ce plugin incroyable
    mais cela pourrait-il fonctionner si je colle le code de vérification Google dans l'en-tête

  16. Merci pour cet excellent article, ma question est : puis-je utiliser ce plugin pour insérer des codes publicitaires comme des codes publicitaires de programmes d'affiliation ?

  17. Bonjour.. j'utilise ce plugin, j'ai une question, puis-je utiliser ce plugin pour insérer plusieurs codes de cette manière..

    Code 1
    Code 2
    Code 3

    Simplement Code 1 puis Bouton Entrée et code 2 et bouton entrée.

    Je veux insérer des codes comme authorship de Google, analytics, webmaster, etc.

      • Bonjour, C'est probablement une question bête, mais si j'ai déjà installé un script Facebook dans l'en-tête et que je veux maintenant en installer un autre de Hotjar, je supprime le script Facebook précédent pour qu'il ne soit pas réinstallé, n'est-ce pas ? Désolé, je ne suis pas très doué en code.

        Merci

        • Salut Isabella,

          Oui, c'est bon de faire ça. Si vous n'êtes pas sûr, vous pouvez simplement copier l'ancien code et l'enregistrer sous forme de fichier texte sur votre ordinateur.

  18. bonjour. sans installer de thème wp, y a-t-il un moyen d'utiliser mon propre thème. ou modèle

  19. C'est un super plugin, je vois qu'il n'a pas été mis à jour depuis plus d'un an. Pourriez-vous s'il vous plaît le mettre à jour ?

    Vladimir

  20. Merci beaucoup pour la vidéo. J'ai essayé de comprendre cela à travers d'autres sites Web, et avec mon propre cerveau, mais j'étais toujours incertain. Votre vidéo était courte et douce, et m'a finalement donné les visuels dont j'avais besoin pour faire le travail. Merci encore !

  21. Salut les gens géniaux, j'ai installé et ajouté le code des articles instantanés FB mais FB dit toujours que le code n'est pas sur le site web.

    Je l'ai ajouté à la section head.

    • J'obtiens « 403 Forbidden

      Une opération potentiellement dangereuse a été détectée dans votre requête vers ce site.

      lorsque j'insère le script Google

  22. Merci ! Étant très nouveau dans la création de sites, et sans expérience du codage, c'était facile à suivre !

  23. salut je suis nouveau sur wp... comment créer une base de données dans wp et créer une insertion de table etc...

  24. Bonjour ! J'utilise Insert Headers and Footers pour ajouter le code Google Analytics à mon site WP. Dois-je m'inquiéter de chaque page de mon site séparément ou est-ce que je couvre l'ensemble du site simplement en suivant les instructions de cette vidéo et en ajoutant le code dans la boîte Headers (Insert Headers and Footers > Settings) ?

  25. Bonjour !

    Ce serait la première fois que j'utilise votre plugin. J'espère rendre mon site web plus sécurisé en ajoutant les scripts suivants dans l'en-tête :

    X-Content-Type-Options: nosniff

    X-Frame-Options: SAMEORIGIN

    X-XSS-Protection: 1; mode=block

    Mes questions sont : Puis-je utiliser votre plugin pour faire cela et si oui, dois-je ajouter les scripts d'en-tête un par un ou tels que je les ai tapés ici.

    Merci pour votre aide !

    • La manière la plus appropriée de définir les en-têtes HTTP dans WordPress est d'utiliser le hook send_headers. Voici un exemple, il va dans le fichier functions.php.

      add_action( 'send_headers', 'add_header_xua' );
      function add_header_xua() {
      	header( 'X-UA-Compatible: IE=edge,chrome=1' );
      }
      

      Admin

  26. Bonjour,

    Je suis nouveau sur WPBeginner.com, et c'est le premier tutoriel que je consulte. Pour être franc, je suis stupéfait qu'un tutoriel dise : « Ici, vous voyez deux zones de texte où vous pouvez ajouter votre code. Copiez et collez simplement toute information méta, scripts, Google Analytics, etc. et cliquez sur « enregistrer les paramètres ». Ce code sera maintenant affiché dans votre en-tête ou votre pied de page. »

    Malheureusement, il n'y a aucun lien vers des informations qui aident un débutant à comprendre comment obtenir ou utiliser le code indiqué. Cela rend le plugin inutile pour moi.

    Mon utilisation de ce plugin est de le connecter à des pages telles que la politique de confidentialité et l'avis de non-responsabilité de l'éditeur. Existe-t-il un tutoriel quelque part qui montre cela ? Si oui, veuillez y lier depuis cette page.

  27. Les en-têtes peuvent-ils être des menus statiques qui incluent du texte, des graphiques et des liens vers des pages ? Idem pour les pieds de page.
    est mon site et il est développé avec FrontPage. Nous voulons simplement convertir l'intégralité du site vers Word Press aussi simplement que possible. Tous les liens mènent vers d'autres pages du site, des fichiers PDF et Word du site, et quelques liens externes. Pas de formulaires, pas de base de données dynamique, PAS de recherches.

    toute aide serait appréciée

  28. Même résultat en insérant dans le hook wp_head dans Genesis Simple Hooks ? Cela a fonctionné pour moi.

  29. Il semble que votre thème WordPress n'utilise pas les fonctions standard wp_header et wp_footer. Veuillez essayer de passer temporairement à un thème par défaut comme twenty thirteen et voir si le problème persiste.

  30. J'ai utilisé ce plugin avec plaisir jusqu'à l'autre jour, lorsque nous avons mis à niveau vers la dernière version du thème (une mise à niveau majeure). Le plugin a cassé notre menu (il a fallu pas mal de recherches pour le cerner et être sûr que c'était ce plugin qui causait le conflit), j'ai donc dû le désactiver. Comme vous pouvez l'imaginer, ce n'est pas une bonne solution, car la vérification de notre site Google, les informations de l'éditeur, le suivi analytique, etc., n'existent plus dans l'en-tête de notre site. Avez-vous des suggestions concernant du code supplémentaire que je pourrais inclure pour résoudre le problème ? Merci.

  31. Bonjour. J'ai remarqué que je dois désactiver le plugin pour voir mes images afin de les insérer dans un article. Y a-t-il un moyen de résoudre ce problème ? J'adore le plugin par ailleurs !

  32. Combien de temps faut-il avant que le code commence à publier des données pour Google Analytics ?

  33. Bonjour,
    J'essaie de mettre à jour ma ligne de code dans Google Analytics pour obtenir des informations démographiques. Je suis sûr de l'avoir correctement collée dans l'en-tête (et le pied de page, que j'ai toujours eu là, mais que je viens de lire dans un commentaire précédent comme étant inutile.) Lorsque je clique sur le bouton dans Google Analytics pour valider le code, il ne reconnaît pas le changement. J'ai essayé plusieurs fois. Pourriez-vous m'aider à trouver une solution, s'il vous plaît ? Merci !

  34. Puis-je utiliser ce plugin pour ajouter du code JavaScript ? Comme un script de redirection ?

    Merci !

      • Bonjour, je viens d'installer votre plugin, et je comprends qu'il permet d'insérer du code sur l'ensemble du site dans l'en-tête, avez-vous une version/recommandation pour un plugin qui fonctionne séparément pour chaque page du site ?

        Merci beaucoup !

  35. J'utilise Genesis et je cherche un pied de page qui soit beaucoup plus plug and play, comme un widget où les champs typiques du pied de page peuvent être saisis par un utilisateur professionnel (non-codeur). Même les pieds de page basés sur des widgets que je vois sur le marché vont seulement jusqu'à dire ok, voici votre espace, maintenant ajoutez un widget aléatoire avec des extraits de code (bien au-delà de mes compétences).

    Si cette magie n'existe pas, puis-je simplement copier le code du pied de page que vous utilisez sur wpbeginner.com, modifier les informations et le coller dans un widget Texte dans ma position de Pied de page 1 ?

  36. Si j'utilise ceci pour Google Analytics, dois-je l'insérer dans l'en-tête et le pied de page ou seulement dans le pied de page. désolé pour la question simple. Je suis tout au début de mon apprentissage.

  37. Comment ajouter des scripts dans l'en-tête d'une seule page spécifique ? Ce plugin n'est applicable que si vous ajoutez un script pour toutes les pages, mais pas si vous l'ajoutez sur une page spécifique.

    • pour « Comment ajouter des scripts d'en-tête sur une seule page « spécifique » ? Ce plugin n'est applicable que si vous ajoutez un script pour toutes les pages, mais pas si vous l'ajoutez sur une page spécifique. »
      Vous pouvez utiliser PHP avec les informations suivantes :
      http://codex.wordpress.org/Conditional_Tags
      en conjonction avec vos scripts.

  38. J'ai fait cela et je vois que le script apparaît dans le pied de page de ma page. Cependant, Google Analytics indique toujours que le suivi n'est pas installé. Aidez-moi s'il vous plaît !

  39. J'obtiens le message : wp_register_style a été appelé de manière incorrecte. Les scripts et les styles ne doivent pas être enregistrés ou mis en file d'attente avant les hooks wp_enqueue_scripts, admin_enqueue_scripts ou init. Veuillez consulter le débogage dans WordPress pour plus d'informations. (Ce message a été ajouté dans la version 3.3.) dans C:\tools\xampp\htdocs\wpfrontier\wp-includes\functions.php à la ligne 2758
    lorsque je l'utilise pour insérer le code de police Google dans l'en-tête

    • Ce plugin est principalement conçu pour les scripts d'analyse ou les méta-informations. Il n'est pas destiné à être utilisé pour insérer du jQuery ou d'autres éléments de conception comme ceux-ci. Le but était de permettre aux utilisateurs d'ajouter facilement des balises dans leur en-tête ou leur pied de page sans modifier les fichiers du thème.

      Admin

  40. J'ai essayé d'ajouter des balises méta FB dans l'en-tête avec ce plugin, mais cela n'a pas fonctionné. L'idée est bonne, cependant.

    • Si vous essayez d'ajouter du code PHP dynamique dans ce plugin, alors cela ne fonctionnera pas. Ce plugin n'exécute pas de PHP. Il est principalement destiné à l'insertion de balises méta statiques.

      Admin

      • Well, I don’t know if those tags are dynamic or static :) I tried the standard Facebook tags such as this:

        <meta property="og:url" content="”/>
        <meta property="og:title" content="” />
        <meta property="og:description" content="ID)); ?>” />

        <meta property="og:image" content="ID ) ) ?>” />

        Pouvez-vous me dire si ce plugin est bon à cet effet ? Merci

  41. un excellent plugin mais mon thème personnalisé a déjà cette option ! je vais mettre ce post en favoris au cas où je changerais de thème.

    • Oui, son objectif principal est de vous éviter d'être dépendant du thème. Souvent, les gens placent leurs codes Analytics, etc. dans la zone de scripts du pied de page de leur thème, comme ceci. Ensuite, ils l'oublient lorsqu'ils changent de thème. Cela leur fait perdre des données d'analyse pendant plusieurs jours.

      Admin

Laisser un commentaire

Merci d'avoir choisi de laisser un commentaire. N'oubliez pas que tous les commentaires sont modérés conformément à notre politique de commentaires, et votre adresse e-mail ne sera PAS publiée. Veuillez NE PAS utiliser de mots-clés dans le champ du nom. Ayons une conversation personnelle et significative.