Sélectionner une page


Ajouter du code à WordPress

Il arrive plus souvent que vous deviez gérer des scripts (codes) qui vous permettent d’ajouter des fonctionnalités à WordPress qui ne sont pas toujours incluses dans un tout nouveau package Installer et activer le plugin.

Ajouter Code sur WordPress dans l’en-tête ou le pied de page du sujetCela nécessite généralement d’accéder aux dossiers de thèmes de votre site Web et de modifier certains fichiers pour placer ces scripts. Vous pouvez ensuite exécuter d’autres processus qui en découlent.

Pour les plugins qui peuvent être utilisés pour ajouter du code dans les en-têtes et les pieds de page des sujets, je tiens à dire que beaucoup d’utilisateurs sont issus de secteurs qui n’ont rien à voir avec la programmation ou la mise en page WordPress. Pourquoi avez-vous du mal avec les fichiers .php si ce n’est pas votre objectif?

Lisez la suite pour savoir que l’ajout de scripts dans WordPress peut être fait avec un plugin Et aussi qu’ils fonctionnent!

Mon cher collègue #sysadmin Carlos de Webempresa m’a demandé de vous rappeler que certains fichiers ou thèmes WordPress de base ne peuvent pas être modifiés à partir du tableau de bord.

Alors…

Vous devez en tenir compte depuis WordPress 4.9 Il n’est pas possible d’éditer des fichiers comme header.php ou footer.php via le tableau de bord, l’affichage, l’éditeur.

Mais je ferais mieux de vous expliquer la raison de cet avis ci-dessous …

Script pour les cas d’utilisation dans WordPress


Il existe des centaines de situations dans lesquelles il est nécessaire d’éditer des fichiers du thème WordPress actif afin d’ajouter des codes de différents types et de cette manière d’étendre des fonctions ou de se connecter à des services externes.

Je mentionne certains des cas typiques qui justifient l’édition de fichiers comme header.php ou footer.php pour ajouter des scripts.

  • Saisissez un code de suivi pour une campagne AdWords.
  • Saisissez le code de suivi pour Google Analytics.
  • Ajoutez un code de validation de domaine pour MailChimp, Acumbamail, Mailrelay, etc.
  • Ajoutez le code de validation du domaine Google Analytics.
  • Ajoutez du CSS personnalisé dans l’en-tête ou le pied de page.
  • Entrez le code du pixel Facebook.
  • Ajoutez du code HTML ou JavaScript.
  • Et un long etcetera …

En fin de compte, le fait est que vous pouvez ajouter du code fourni par certains services externes sur votre site Web sans avoir à vous soucier du thème WordPress ou des fichiers de code de base (je ne recommande pas de changer ce dernier, en utilisant d’autres options) et au-dessus de tout si le vôtre n’est pas t le code.

El Plugin insérer des en-têtes et des pieds de page


Mettre du code dans les en-têtes et les pieds de page est quelque chose que vous pouvez faire avec des plugins comme Insérer des en-têtes et des pieds de page, développé par les gars WPBeginner (Je vous recommande de les suivre sur leur site Web) ce qui vous permet de coller du code sans avoir à modifier manuellement les fichiers de votre thème que vous utilisez.

Insérer des en-têtes et des pieds de page

Cliquez sur l’image pour accéder au lien du plugin

Fonctions du plugin:

  • Il est très rapide à installer.
  • Ajoutez des scripts imbriqués dans l’en-tête ou le pied de page.
  • Vous pouvez ajouter un code d’en-tête et / ou de pied de page.
  • Vous pouvez insérer n’importe quel code ou script, y compris HTML et Javascript.

Si pour une raison quelconque vous n’avez pas besoin d’utiliser ce plugin après qu’il a fonctionné pendant un certain temps avec un script dans l’en-tête ou le pied de page, Dès que vous désactivez ou désinstallez le plugin, le script ne sera plus opérationnel (ceux que vous mettez dans le plugin) sans avoir à le supprimer manuellement du fichier de thème.

Installation et utilisation du plugin


Vous pouvez trouver le plugin dans le tableau de bord, Plugins, Ajouter un nouveauTrouvez le nom et cliquez sur Installer et activer.

Ensuite, allez dans Paramètres, Insérer des en-têtes et des pieds de page et vous verrez l’écran de configuration et l’utilisation unique du plugin où vous pouvez ajouter des codes comme je l’ai donné dans l’exemple.

Script et en-têtes

Cliquez sur l’image pour l’agrandir

Par exemple, si vous collez le script dans « En-têtes » et enregistrez les modifications dans le plugin, sur la page d’accueil de votre site Web, faites un clic droit, dites « Voir le code source de la page ». Dans un nouveau navigateur dans un onglet, vous pouvez voir la source du Web et trouver le script inséré:

     <script id="mcjs">!function(c,h,i,m,p){m=c.createElement(h),p=c.getElementsByTagName(h)[0],m.async=1,m.src=i,p.parentNode.insertBefore(m,p)}(document,"script","https://chimpstatic.com/mcjs-connected/js/users/595ea6ba3faXXXXXXXXXXXc4e7XXXXXXXXXXXXXXXXXXXX.js");</script> 

Vous pouvez exécuter Ctrl + F et rechercher la chaîne, par exemple Fonction (c, h, i, m, p) pour le reconnaître rapidement sans que vos cils ne regardent le code 😛

Afficher la source de la page

Cliquez sur l’image pour l’agrandir

Cela montre qu’une fois les modifications enregistrées dans le plugin, le script ajouté devient opérationnel et se trouve dans le code source de la page.

Qu’en pense PageSpeed Insights?


Dans un commentaire avec Carlos (rappelez-vous, mon cher collègue et administrateur système de Webempresa), il m’a dit: « Est-il certain que mettre des scripts dans le pied de page ou l’en-tête est une bonne idée? » Cela s’applique, par exemple, aux installations utilisant Autoptimize ou Magic Cache en raison d’éventuels problèmes de chargement ou d’erreurs.

Pour que cela soit clair Insérer des en-têtes et des pieds de page Il a un comportement acceptable une fois activé et un script ajouté dans l’en-tête ou le pied de page. Je vais vous montrer les tests effectués à cet égard.

Le site Web où j’ai créé PoC avec le plugin et divers scripts pour header.php et footer.php avant d’installer et d’activer « Insérer les en-têtes et pieds de page » et d’ajouter des scripts.

PageSpeed ​​Insights avant d'insérer le script

Cliquez sur l’image pour l’agrandir

J’installe le plugin, ajoute un script de validation de domaine MailChimp (voir ci-dessus) puis vérifie le chargement Web avec PageSpeed Insights pour voir ce qu’il en dit …

PageSpeed ​​Insights après avoir collé le script

Cliquez sur l’image pour l’agrandir

Fondamentalement, le résultat pour le bureau reste, à l’exception du petit changement de score dans la version mobile qui est moins optimisée et avec le script dans « Header » dans les deux tests 95/100 Par conséquent, le fait que le script MailChimp ait été inclus avec le plugin ne signifie pas une diminution de la vitesse de chargement ou de l’optimisation Insérer des en-têtes et des pieds de page.

Évidemment, ces tests varieront en fonction des autres plugins que vous aurez installés, principalement la mise en cache et la minification, le thème utilisé, ainsi que les éléments que vous chargez sur la couverture.

Insérer une vidéo expliquant comment utiliser les en-têtes et les pieds de page


Comme preuve de concept, je voudrais illustrer le cas de l’activation d’un domaine dans MailChimp, qui à son tour fournit un script pour le contrôle de validation et la gestion des données entre les deux sites (pont), et comment ce script est ajouté dans une installation WordPress.


C’est un processus très simple à utiliser et qui vous permet de valider rapidement des services ou d’ajouter des fonctionnalités dans WordPress.

Conclusions.


Vous n’avez pas besoin d’avoir des connaissances en programmation avec PHP ou comment gérer certains styles CSS globaux que vous souhaitez ajouter à votre page, car vous pouvez le faire avec des plugins comme celui décrit dans cet article Sans vous recroqueviller!

N’oublie jamais Faire une sauvegarde Avant de mettre la main sur les fichiers de base de votre sujet, ne le gâchez pas et n’avez personne vers qui vous tourner!



Source link

Recent Posts