{"id":237397,"date":"2022-04-03T16:59:00","date_gmt":"2022-04-03T13:59:00","guid":{"rendered":"https:\/\/themewp.inform.click\/?p=237397"},"modified":"2022-05-16T10:57:14","modified_gmt":"2022-05-16T07:57:14","slug":"le-moyen-le-plus-simple-dajouter-javascript-a-votre-site-wordpress","status":"publish","type":"post","link":"https:\/\/themewp.inform.click\/fr\/le-moyen-le-plus-simple-dajouter-javascript-a-votre-site-wordpress\/","title":{"rendered":"Le moyen le plus simple d’ajouter Javascript \u00e0 votre site WordPress"},"content":{"rendered":"

Je suis content que tu sois l\u00e0.<\/p>\n

Si vous n’\u00eates pas un d\u00e9veloppeur WordPress exp\u00e9riment\u00e9, l’ajout de Javascript \u00e0 votre site peut \u00eatre assez intimidant. Encore pire\u2026<\/p>\n

Vous pourriez s\u00e9rieusement g\u00e2cher votre site si vous ne faites pas attention.<\/p>\n

Dans ce didacticiel, vous apprendrez le moyen le plus rapide et le plus s\u00fbr d’ajouter du nouveau Javascript \u00e0 votre site WordPress.<\/p>\n

Ajouter un nouveau Javascript \u00e0 WordPress<\/h2>\n

Normalement, vous ajouteriez un th\u00e8me enfant<\/a> ou un plugin qui chargerait ensuite un nouveau fichier Javascript sur votre site.<\/p>\n

Cependant, c’est beaucoup de travail si vous avez juste besoin d’ajouter un ou deux extraits de code JS. La solution la plus simple consiste \u00e0 utiliser le plugin Simple Custom CSS et JS<\/a>.<\/p>\n

\"Le<\/a><\/p>\n

Installez et activez ce plugin sur votre site, et vous verrez un nouvel \u00e9l\u00e9ment de menu CSS & JS personnalis\u00e9 ajout\u00e9 \u00e0 votre tableau de bord. Survolez le nouvel \u00e9l\u00e9ment de menu et cliquez sur l’option "Ajouter un JS personnalis\u00e9" pour commencer \u00e0 ajouter votre javascript.<\/p>\n

\"Le<\/a><\/p>\n

Ajouter le Javascript<\/h3>\n

Sur la page suivante, vous verrez un \u00e9diteur de code dans lequel vous pouvez entrer le JS que vous souhaitez ajouter \u00e0 votre site.<\/p>\n

\"Le<\/a><\/p>\n

Les commentaires dans l’\u00e9diteur sont \u00e9galement tr\u00e8s utiles<\/p>\n

Donnez un titre \u00e0 votre JS pour qu’il soit facile de se rappeler pourquoi vous l’avez ajout\u00e9, puis entrez votre code dans l’\u00e9diteur ci-dessous. Assurez-vous d’abord de supprimer les commentaires, car vous n’avez pas besoin de les ajouter \u00e0 votre site.<\/p>\n

Tester le Javascript<\/h3>\n

Si vous voulez vous assurer que cela fonctionne, vous pouvez ajouter ce JS \u00e0 votre site\u00a0:<\/p>\n

jQuery(document).ready(function( $ ){\n    $('.logged-in').on('click', function(){\n        alert('The code is working!'); \n    });\n});<\/code><\/pre>\n
Voici \u00e0 quoi cela ressemblera dans l’\u00e9diteur.<\/p>\n
\"Le<\/a><\/p>\n
Tout ce que fait ce code est d’afficher une bo\u00eete d’alerte lorsque vous cliquez n’importe o\u00f9 sur le site, comme ceci\u00a0:<\/p>\n
\"Le<\/a><\/p>\n
Cela n’affecte que les utilisateurs connect\u00e9s, donc cela ne perturbera pas vos visiteurs lorsque vous l’ajouterez pour faire un test.<\/p>\n
Une fois que vous \u00eates certain que cela fonctionne, vous pouvez \u00e9changer l’extrait de test avec le vrai JS que vous souhaitez ajouter \u00e0 votre site.<\/p>\n
Configurer les options JS<\/h3>\n
Simple Custom CSS & JS est livr\u00e9 avec quelques options pratiques pour d\u00e9cider exactement comment votre Javascript est ajout\u00e9 au site.<\/p>\n
\"Le<\/a><\/p>\n
Tout d’abord, si vous ajoutez juste un peu de code, conservez le type de lien comme \u00ab\u00a0interne\u00a0\u00bb, ce qui ajoute simplement le code \u00e0 la page. C’est plus simple que de charger un autre fichier et n’aura pas d’impact sur le temps de chargement de votre site.<\/p>\n
Ensuite, si vous ajoutez un script d’analyse, ils vous diront probablement si vous devez l’ajouter \u00e0 l’en-t\u00eate ou au pied de page. Sinon, il vaut mieux utiliser par d\u00e9faut le pied de page.<\/p>\n
Enfin, si le Javascript est cens\u00e9 affecter vos visiteurs, laissez l’option "In Frontend" coch\u00e9e pour le param\u00e8tre Where in site. L’option "Dans Admin" est uniquement pour si vous souhaitez charger le Javascript tout en affichant les pages dans le tableau de bord WP, \u200b\u200bet bien s\u00fbr, l’option "Sur la page de connexion" est uniquement pour la page de connexion des membres.<\/p>\n
Conclusion<\/h2>\n
Cette approche est BEAUCOUP plus facile que de cr\u00e9er un nouveau plugin ou un nouveau th\u00e8me enfant.<\/p>\n
Sans oublier, Simple Custom CSS & JS est un plugin g\u00e9nial, et vous en trouverez probablement d’autres \u00e0 l’avenir. Il existe \u00e9galement une version pro disponible, capable de personnalisations assez impressionnantes si vous avez besoin de plus de flexibilit\u00e9.<\/p>\n
Si vous avez des questions ou des commentaires sur cet article, laissez un commentaire ci-dessous.<\/p>\n
Source d’enregistrement:  www.competethemes.com<\/a><\/div><\/p>\n","protected":false},"excerpt":{"rendered":"
Ne cassez pas votre site ! Suivez ce tutoriel simple pour apprendre le moyen le plus simple et le plus s\u00fbr d’ajouter Javascript \u00e0 votre site WordPress.<\/p>\n","protected":false},"author":1,"featured_media":21627,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":"","_wp_rev_ctl_limit":""},"categories":[568],"tags":[844],"class_list":["post-237397","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-les-bases-de-wordpress","tag-affiai-fr"],"_links":{"self":[{"href":"https:\/\/themewp.inform.click\/fr\/wp-json\/wp\/v2\/posts\/237397","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/themewp.inform.click\/fr\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/themewp.inform.click\/fr\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/themewp.inform.click\/fr\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/themewp.inform.click\/fr\/wp-json\/wp\/v2\/comments?post=237397"}],"version-history":[{"count":0,"href":"https:\/\/themewp.inform.click\/fr\/wp-json\/wp\/v2\/posts\/237397\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/themewp.inform.click\/fr\/wp-json\/wp\/v2\/media\/21627"}],"wp:attachment":[{"href":"https:\/\/themewp.inform.click\/fr\/wp-json\/wp\/v2\/media?parent=237397"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/themewp.inform.click\/fr\/wp-json\/wp\/v2\/categories?post=237397"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/themewp.inform.click\/fr\/wp-json\/wp\/v2\/tags?post=237397"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}