Mettre à jour la version jquery

25

J'exécute WordPress version 4.7.2. et il utilise jQuery version 1.12. J'ai besoin de mettre à jour cette version vers une version supérieure. Je l'ai remplacé par une nouvelle version auparavant, mais lorsque je mets à niveau le noyau WordPress, il est à nouveau remplacé par 1.12. Comment puis-je changer la version de jQuery que WordPress utilise de manière permanente?

Siamak Ferdos
la source

Réponses:

30

Avertissement: vous ne devez pas remplacer la version principale de jQuery, en particulier dans le panneau d'administration . Étant donné que de nombreuses fonctionnalités de base de WordPress peuvent dépendre de la version. En outre,autre module peut dépendre de lajQueryVersion ajouté dans le noyau.

Si vous êtes sûr de vouloir changer la jQueryversion principale , dans ce cas, vous pouvez ajouter le CODE suivant dans le functions.phpfichier de votre thème actif (encore mieux si vous créez un plugin pour cela):

function replace_core_jquery_version() {
    wp_deregister_script( 'jquery' );
    // Change the URL if you want to load a local copy of jQuery from your own server.
    wp_register_script( 'jquery', "https://code.jquery.com/jquery-3.1.1.min.js", array(), '3.1.1' );
}
add_action( 'wp_enqueue_scripts', 'replace_core_jquery_version' );

Cela remplacera la jQueryversion principale et chargera plutôt la version à 3.1.1partir du serveur de Google.

En outre, bien que cela ne soit pas recommandé , vous pouvez également utiliser la ligne supplémentaire suivante de CODE pour remplacer la version jQuery wp-admin:

add_action( 'admin_enqueue_scripts', 'replace_core_jquery_version' );

De cette façon, même après la mise à jour de WordPress, vous aurez la version de jQuerycomme vous le souhaitez.

Une fonction légèrement meilleure:

La replace_core_jquery_versionfonction ci-dessus supprime également le jquery-migratescript ajouté par le noyau WordPress. Ceci est raisonnable, car la dernière version de jQuery ne fonctionnera pas correctement avec une ancienne version de jquery-migrate. Cependant, vous pouvez également inclure une version plus récente de jquery-migrate. Dans ce cas, utilisez plutôt la fonction suivante:

function replace_core_jquery_version() {
    wp_deregister_script( 'jquery-core' );
    wp_register_script( 'jquery-core', "https://code.jquery.com/jquery-3.1.1.min.js", array(), '3.1.1' );
    wp_deregister_script( 'jquery-migrate' );
    wp_register_script( 'jquery-migrate', "https://code.jquery.com/jquery-migrate-3.0.0.min.js", array(), '3.0.0' );
}
Fayaz
la source
Pouvez-vous simplement supprimer l'action de functions.php si vous trouvez qu'elle rompt votre thème? Reviendra-t-il à la version originale de jQuery ou s'agit-il d'un changement permanent?
Nick
1
Si la fonction de rappel de l' wp_enqueue_scriptsaction ne met à jour que jQuery et que jQuery est mis en file d'attente ailleurs, la suppression de l'action restaurera jQuery d'origine. Cependant, parfois, les navigateurs mettent en cache l'ancien CODE, en fonction des paramètres de cache du serveur, vous devrez donc vider le cache du navigateur après avoir fait cela pour voir le changement.
Fayaz
ok merci je voulais juste m'assurer que je n'ai pas foiré mon site avant d'ajouter cette action. J'ai eu le sentiment que ce que vous avez dit est exact, mais je voulais faire preuve de prudence.
Nick
1
Ce n'est évidemment pas permanent , car ce changement dépend du CODE lui-même, rien n'est enregistré dans la base de données. Ainsi, la suppression du CODE associé reviendra à l'ancien état.
Fayaz
Le script de migration pour les versions 3.x ne fonctionne pas lorsque les plugins / thèmes attendent une version inférieure à 1.12. Plus d'informations à ce sujet ici: wordpress.stackexchange.com/a/244543/75495
cjbj
5

J'ai développé un plugin pour ce problème spécifique. Le plugin ne dérange pas avec WordPress jQuery car il n'est chargé que dans le front-end. Voir: jQuery Manager pour WordPress

Pourquoi encore un autre outil jQuery Updater / Manager / Developer / Debugging?

Parce qu'aucun des outils de développement ne vous permet de sélectionner une version spécifique de jQuery et / ou jQuery Migrate. Fournir à la fois la production et la version minifiée. Voir les fonctionnalités ci-dessous!

✅ Uniquement exécuté dans le front-end, n'interfère pas avec l'admin / backend WordPress et le personnalisateur WP (pour des raisons de compatibilité) Voir: https://core.trac.wordpress.org/ticket/45130 et https: // core. trac.wordpress.org/ticket/37110

Activer / désactiver jQuery et / ou jQuery Migrate

✅ Activer une version spécifique de jQuery et / ou jQuery Migrate

Et beaucoup plus! Le code est open source, vous pouvez donc l'étudier, en tirer des enseignements et y contribuer.


Presque tout le monde utilise la mauvaise poignée

WordPress utilise en fait le handle jquery-core, pas jquery:

https://github.com/WordPress/WordPress/blob/91da29d9afaa664eb84e1261ebb916b18a362aa9/wp-includes/script-loader.php#L226

// jQuery
$scripts->add( 'jquery', false, array( 'jquery-core', 'jquery-migrate' ), '1.12.4' );
$scripts->add( 'jquery-core', '/wp-includes/js/jquery/jquery.js', array(), '1.12.4' );
$scripts->add( 'jquery-migrate', "/wp-includes/js/jquery/jquery-migrate$suffix.js", array(), '1.4.1' );

Le descripteur jquery est juste un alias pour charger jquery-core avec jquery-migrate

Voir plus d'informations sur les alias: wp_register_script identifiants multiples?

La bonne façon de le faire

Dans mon exemple ci-dessous, j'utilise le CDN jQuery officiel sur https://code.jquery.com J'utilise également script_loader_tag pour pouvoir ajouter des attributs CDN.
Vous pouvez utiliser le code suivant:

// Front-end not excuted in the wp admin and the wp customizer (for compatibility reasons)
// See: https://core.trac.wordpress.org/ticket/45130 and https://core.trac.wordpress.org/ticket/37110
function wp_jquery_manager_plugin_front_end_scripts() {
    $wp_admin = is_admin();
    $wp_customizer = is_customize_preview();

    // jQuery
    if ( $wp_admin || $wp_customizer ) {
        // echo 'We are in the WP Admin or in the WP Customizer';
        return;
    }
    else {
        // Deregister WP core jQuery, see https://github.com/Remzi1993/wp-jquery-manager/issues/2 and https://github.com/WordPress/WordPress/blob/91da29d9afaa664eb84e1261ebb916b18a362aa9/wp-includes/script-loader.php#L226
        wp_deregister_script( 'jquery' ); // the jquery handle is just an alias to load jquery-core with jquery-migrate
        // Deregister WP jQuery
        wp_deregister_script( 'jquery-core' );
        // Deregister WP jQuery Migrate
        wp_deregister_script( 'jquery-migrate' );

        // Register jQuery in the head
        wp_register_script( 'jquery-core', 'https://code.jquery.com/jquery-3.3.1.min.js', array(), null, false );

        /**
         * Register jquery using jquery-core as a dependency, so other scripts could use the jquery handle
         * see /wordpress/283828/wp-register-script-multiple-identifiers
         * We first register the script and afther that we enqueue it, see why:
         * /wordpress/82490/when-should-i-use-wp-register-script-with-wp-enqueue-script-vs-just-wp-enque
         * /programming/39653993/what-is-diffrence-between-wp-enqueue-script-and-wp-register-script
         */
        wp_register_script( 'jquery', false, array( 'jquery-core' ), null, false );
        wp_enqueue_script( 'jquery' );
    }
}
add_action( 'wp_enqueue_scripts', 'wp_jquery_manager_plugin_front_end_scripts' );


function add_jquery_attributes( $tag, $handle ) {
    if ( 'jquery-core' === $handle ) {
        return str_replace( "type='text/javascript'", "type='text/javascript' integrity='sha256-FgpCb/KJQlLNfOu91ta32o/NMZxltwRo8QtmkMRdAu8=' crossorigin='anonymous'", $tag );
    }
    return $tag;
}
add_filter( 'script_loader_tag', 'add_jquery_attributes', 10, 2 );
Remzi Cavdar
la source