Comment installer jQuery sur WordPress ?

Vérifier que jQuery est corectement installé sur ton thème, c’est facile !

jQuery est un framework javascript qui assure le bon fonctionnement de ton thème et de l’éditeur de texte pour les articles. En règle générale, il est installé sur ton thème. Pour le vérifier et voir la version procède comme suit :

Depuis Google chrome, Clic droit sur un article, puis clique sur inspecter. L’inspecteur de chrome s’ouvre (non sans blague).

clic droit inspecter

Ensuite, il faut aller dans wp-includes/js/jquery/ dans l’onglet sources :

jquery wp

 

Ceci te permet de connaître la version de jQuery sur ton thème.

Mais peut-être veux-tu ″installer″ jQuery-UI et ses fameux widgets (gadgets). Dans ce cas, il faudra que les versions de jQuery et celles de jQuery-UI, soient les mêmes, ce qui n’est pas gagné. Le plus simple est alors de ″réinstaller″ les deux fichiers de jQuery et jQuery-UI.

Voici comment faire.

Logo jQuery

Récupérer les cdn sur Google (ou  jQuery)

ces liens ″d’installation″ sont disponibles à cette adresse  : https://developers.google.com/speed/libraries

Par exemple :

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js">
</script>
<script src="//ajax.googleapis.com/ajax/libs/jqueryui/1.9.1/jquery-ui.min.js">
</script>

De façon générale, ces liens doivent être placés dans votre document HTML après les fichiers jQuery du thème pour les écraser. Voyons comment faire sous WordPress.

  • Première méthode : utiliser le plugins post layout

post layout est un plugins très intéressant, parce qu’il permet d’insérer des bouts de code au début, au milieu, ou à la fin des articles et des pages WordPress. Contre toute attente, je vous conseille de placer lien google ci-dessus, en bas de page, cela accélérera le chargement et surtout l’affichage de vos pages.

  • Deuxième méthode : utiliser le mode texte des articles.

Si vous devez utiliser jQuery et jQuery UI ponctuellement, vous pouvez installer les liens dans l’article. Pour cela, collez les scripts de cdn directement dans l’article en mode Texte et c’est tout.
En visualisant  2 fois l’article, on vérifie si cela fonctionne.

  • Troisième méthode : utiliser l’éditeur de texte WordPress (non recommandé).

Sur votre panneau d’administration wordPress sélectionnez l’onglet apparence > éditeur et choisissez l’un des fichiers suivant entête (header.php), article seul (single.php) ou pied de page (footer.php).
Placez ces deux scripts dans l’un de ces fichiers et vérifiez si cela fonctionne. Encore une fois, c’est dans le footer que la vitesse d’affichage est optimale.
En visualisant 2 fois l’article, on vérifie si cela fonctionne.

Vérifier que jQuery UI fonctionne

Pour vérifier que jQuery UI fonctionne, je vous invite à consulter l’article sur Comment faire du drag and drop avec jQuery

Voilà, ce mini article est fini. On se quitte déjà. Bouuuuuhhhh.

A bientôt

Ces articles pourraient vous intéresser :
6 Comments

Add a Comment

Votre adresse de messagerie ne sera pas publiée. Les champs obligatoires sont indiqués avec *

Lire plus :
Jetpack_Joyride
Jetpack Joyride pour Android : propulsé par votre Jetpack, éviterez-vous les embûches.

Avec votre Jetpack sur le dos, progressez dans des couloirs et évitez les pièges tendus sur votre chemin. Tel est...

backlinks
Les 4 meilleurs sites pour connaître et suivre l’évolution des backlinks.

Avoir une vue d'ensemble des backlinks d'un site et connaître leur évolution au cours du temps, est indispensable pour le SEO...

localisation hebergeur
Comment connaître l’hébergeur d’un site web ?

L'hébergement d'un site web est fondamental pour sa réussite et son référencement. Si le temps de chargement des pages est...

Fermer