web-dev-qa-db-fra.com

Comment lier des fichiers jQuery/Javascript externes avec WordPress

J'utilise donc Starkers pour baser mon prochain thème WP et j'ai rencontré un petit problème. J'inclus ma propre version de jQuery dans le fichier header.php. Lors de l'inspection de mon site à l'aide de Firebug, j'ai remarqué jquery a été téléchargé deux fois, j’ai creusé un peu et j’ai remarqué que non seulement j’avais inclus le fichier, mais aussi la fonction wp_head().

En essayant de résoudre le problème, j'ai remarqué un commentaire dans le fichier d'en-tête, qui provenait du thème Twenty Ten:

/* Always have wp_head() just before the closing </head>
 * tag of your theme, or you will break many plugins, which
 * generally use this hook to add elements to <head>, such 
 * as styles, scripts, and meta tags
 */

Alors voici mon problème, j'ai l'impression que le fichier jQuery doit être défini avant tout autre fichier qui veut l'utiliser et que wp_head() devrait être la dernière chose dans l'élément <head>, je suis un peu confus maintenant car je suis je me demandais si je devais mettre wp_head() en haut pour que le fichier jQuery WP inclus soit utilisé pour tous mes plugins, même s'il ne le fait pas.

J'ai commenté la ligne jQuery dans la fonction wp_head(), mais elle est obligatoire pour la page d'administration et j'ai donc dû la remettre en place.

J'aimerais également (au moins expérimenter) utiliser la version Google CDN de jQuery, mais je ne souhaite pas l'inclure deux fois!

J'espère que vous comprenez ce que j'essaie d'expliquer. Toute suggestion sur la façon de résoudre ce problème serait très appréciée. J'apprécierais également tout conseil sur la façon dont vous gérez vos fichiers JavaScript avec le fichier d'en-tête.

Merci!

themescustomizationtheme-developmentjquerywp-head
15
Ben Everard

D'après le libellé de votre question, vous devez ajouter des scripts en écrivant des balises <script> dans votre modèle. Ajoutez vos propres scripts via wp_enqueue_script() dans le functions.php de votre modèle, définissez correctement les dépendances sur jQuery et wp_head() ajoutera les scripts pour vous.

function my_scripts() {
    wp_enqueue_script( 'my-sweet-script', get_bloginfo('template_directory') . '/script.js', array('jquery') );
}
add_action('template_redirect', 'my_scripts');

Voir la page codex pour plus d'informations.

9
Annika Backstrom

Je suggère de jeter un coup d'œil à 5 conseils pour utiliser jQuery avec WordPress . Entre autres choses, il montre le code nécessaire pour charger jQuery à partir de la bibliothèque de Google:

function my_init() {
    if (!is_admin()) {
        // comment out the next two lines to load the local copy of jQuery
        wp_deregister_script('jquery');
        wp_register_script('jquery', 'http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js', false, '1.3.2');
        wp_enqueue_script('jquery');
    }
}
add_action('init', 'my_init');

Vous pouvez également consulter le Utiliser les bibliothèques Google plugin.

7
Travis Northcutt

Bien que @tnorthcutt ait raison de retirer correctement le jquery natif de WP si vous souhaitez charger le vôtre, vous êtes certain de rencontrer des problèmes lorsque vous chargez une version de jquery différente de WP core. Le noyau et les plugins dépendent de sa présence. Ainsi, si vous ne mettez pas à jour votre thème avec la dernière version de la requête jQuery chaque fois que WP est mis à jour, votre site risque de ne pas fonctionner correctement.

Le code suivant vous assurera que votre thème charge toujours la version correcte de jQuery en recherchant d'abord la version utilisée par WP, puis en la chargeant depuis Google:

$wp_jquery_version = $GLOBALS['wp_scripts']->registered['jquery-core']->ver;
$jquery_version = ( $wp_jquery_version == '' ) ? '1.8.3' : $wp_jquery_version; // fallback, just in case 
wp_deregister_script('jquery');
wp_register_script('jquery', 'http://ajax.googleapis.com/ajax/libs/jquery/'. $jquery_version .'/jquery.min.js', $jquery_version, false );
wp_enqueue_script('jquery');
1
cjbj