Comment utiliser wp_enqueue_script () pour inclure des fichiers JavaScript dans WordPress

By | juillet 7, 2020
0 Comment

WordPress pas cher

Vous voulez savoir comment inclure un fichier JavaScript sur votre site WordPress? Dans ce Quick Quide, nous utilisons une fonction WordPress géniale appelée wp_enqueue_script () C'est les bonne façon d'inclure des fichiers JavaScript dans WordPress. Que vos fichiers JavaScript soient pour Vue, React, JQuery ou autre, c'est ainsi que vous incluez des fichiers JavaScript dans des pages WordPress.

En bref, wp_enqueue_script () est la fonction qui indique à WordPress «d'ajouter» – mettre en file d'attente – un nouveau fichier JavaScript à ajouter à WordPress. Il fonctionne en tandem avec un morceau de code nommé de manière très similaire, wp_enqueue_scripts, qui est le crochet d'action WordPress auquel notre individu appelle wp_enqueue_script () "collera". Ne vous inquiétez pas, nous vous expliquerons tout dans le guide vidéo et la démonstration de code ci-dessous. 🙂

Le guide vidéo couvre l'ajout de fichiers JavaScript dans un WordPress personnalisé brancher. Cependant, l'ajout de fichiers JavaScript à un WordPress thème est un processus très similaire, donc la vidéo peut vous aider à comprendre comment faire les deux. C'est ici:

Et voici la version texte de ce même guide pour savoir comment utiliser wp_enqueue_script () dans WordPress…

Comment utiliser wp_enqueue_script () ajouter du JavaScript à chaque page de votre site WordPress

  1. Vous allez écrire PHP, et nous allons supposer que vous avez un plugin personnalisé configuré pour le faire. Sinon, consultez notre introduction sur la création d'un plugin WordPress. (Si vous essayez de le faire pour un thème, vous devez mettre le code suivant dans votre functions.php fichier.)
  2. Écrivez la ligne add_action ('wp_enqueue_scripts', 'qg_enqueue');. N'enregistrez pas encore, car enregistrer sans avoir écrit le qg_enqueue () la fonction elle-même "temporairement" cassera votre site.
  3. Créez cette fonction qg_enqueue () avec un basique function qg_enqueue () expression. Il est désormais sûr d'enregistrer.
  4. Ajoutez un corps à la fonction qui enregistre et met en file d'attente votre script en utilisant wp_enqueue_script (). Notre exemple ressemble à:
    wp_enqueue_script ('qgjs', plugin_dir_url (__ FILE __). 'quick-guide.js');.
  5. Votre wp_enqueue_script () l'appel sera spécifique au "nom abrégé" de votre fichier JavaScript, à son emplacement et à son nom. Si vous travaillez dans un plugin, comme dans notre exemple, en utilisant plugin_dir_url () avec la magie __FICHIER__ constante est le moyen le plus simple et le plus courant d'accéder au dossier racine du plugin. (Si vous travaillez sur un thème, get_stylesheet_directory_uri () est une fonction tout aussi utile pour accéder à la racine du thème en cours d'exécution.) Ensuite, le dernier morceau, quick-guide.js, est l'endroit où vous devez aller (dossier et nom de fichier) par rapport au répertoire racine que vous avez créé avec plugin_dir_url ().

Comment utiliser wp_enqueue_script () ajouter du JavaScript à chaque page de votre site WordPress: exemple de code complet

Puisqu'il peut être utile de voir tout le code à la fois, voici la version finale du code de notre plugin personnalisé:

add_action ('wp_enqueue_scripts', 'qg_enqueue');
function qg_enqueue () 
    wp_enqueue_script (
        «qgjs»,
        plugin_dir_url (__ FILE __). 'quick-guide.js'
    );

Et voilà comment ajouter un fichier JavaScript dans WordPress!

Autres ressources:

  1. Si vous souhaitez en savoir plus sur la mise en file d'attente des deux fichiers JavaScript et Feuilles de style CSS dans WordPress, lisez notre article complet sur le sujet.
  2. Si vous voulez mieux comprendre comment plugin_dir_url () fonctionne et quelle fonction fonctionne de manière équivalente pour les thèmes WordPress, consultez notre article sur les liens vers les ressources de thème et de plugin.
  3. Et si vous souhaitez inclure un fichier JavaScript uniquement certains pages de votre site WordPress, lisez notre guide de mise en file d'attente conditionnelle des fichiers JavaScript.

[ad_2]

Articles relatifs: