Actualizar la versión de jquery

24

Ejecuto WordPress versión 4.7.2. y usa jQuery versión 1.12. Necesito actualizar esta versión a una superior. Lo reemplacé con una nueva versión antes, pero cuando actualizo el núcleo de WordPress, se reemplaza con 1.12 nuevamente. ¿Cómo puedo cambiar la versión de jQuery que WordPress usa permanentemente?

Siamak Ferdos
fuente

Respuestas:

29

Advertencia: No debe reemplazar la versión principal de jQuery, especialmente en el panel de administración . Dado que muchas funciones principales de WordPress pueden depender de la versión. Además, otro complemento puede depender de lajQueryversión agregada en el núcleo.

Si está seguro de que desea cambiar la jQueryversión principal , en ese caso puede agregar el siguiente CÓDIGO en el functions.phparchivo de su tema activo (incluso mejor si crea un complemento para esto):

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' );

Esto reemplazará la jQueryversión principal y, en su lugar, cargará la versión 3.1.1del servidor de Google.

Además, aunque no se recomienda , también puede usar la siguiente línea adicional de CÓDIGO para reemplazar la versión de jQuery wp-admin:

add_action( 'admin_enqueue_scripts', 'replace_core_jquery_version' );

De esta manera, incluso después de actualizar WordPress, tendrá la versión jQueryque desee.

Una función ligeramente mejor:

La replace_core_jquery_versionfunción anterior también elimina el jquery-migratescript agregado por el núcleo de WordPress. Esto es razonable, porque la versión más reciente de jQuery no funcionará correctamente con una versión anterior de jquery-migrate. Sin embargo, también puede incluir una versión más nueva de jquery-migrate. En ese caso, use la siguiente función:

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
fuente
¿Puedes eliminar la acción de functions.php si encuentras que rompe tu tema? ¿Volverá a la versión original de jQuery o es un cambio permanente?
Nick
1
Si la función de devolución de llamada de la wp_enqueue_scriptsacción solo actualiza jQuery y se está poniendo en cola jQuery desde otro lugar, la eliminación de la acción restaurará jQuery original. Sin embargo, a veces los navegadores almacenan en caché el antiguo CÓDIGO, dependiendo de la configuración de la memoria caché del servidor, por lo tanto, deberá borrar la memoria caché del navegador después de hacer eso para ver el cambio.
Fayaz
ok, gracias, solo quería asegurarme de no arruinar mi sitio antes de agregar esta acción. Tenía la sensación de que lo que dijiste es correcto, pero quería ir a lo seguro.
Nick
1
Obviamente , esto no es permanente , ya que este cambio depende del CÓDIGO mismo, no se guarda nada en la base de datos. Por lo tanto, eliminar el CÓDIGO relacionado volverá al estado anterior.
Fayaz
El script de migración para las versiones 3.x no funciona cuando los complementos / temas esperan una versión inferior a 1.12. Más sobre eso aquí: wordpress.stackexchange.com/a/244543/75495
cjbj
5

He desarrollado un complemento para este problema específico. El complemento no se mete con WordPress jQuery, ya que solo se carga en el front-end. Ver: jQuery Manager para WordPress

¿Por qué otra herramienta jQuery Updater / Manager / Developer / Debugging?

Debido a que ninguna de las herramientas de desarrollador le permite seleccionar una versión específica de jQuery y / o jQuery Migrate. Proporcionando tanto la producción como la versión minificada. ¡Vea las características a continuación!

✅ Solo se ejecuta en el front-end, no interfiere con el administrador / backend de WordPress y el personalizador de WP (por razones de compatibilidad) Consulte: https://core.trac.wordpress.org/ticket/45130 y https: // core. trac.wordpress.org/ticket/37110

Active / desactive jQuery y / o jQuery Migrate

✅ Active una versión específica de jQuery y / o jQuery Migrate

¡Y mucho más! El código es de código abierto, por lo que puede estudiarlo, aprender de él y contribuir.


Casi todos usan el mango incorrecto

WordPress en realidad usa el controlador jquery-core, no 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' );

El identificador jquery es solo un alias para cargar jquery-core con jquery-migrate.

Ver más información sobre alias: wp_register_script identificadores múltiples?

La forma correcta de hacerlo

En mi ejemplo a continuación, uso el jQuery CDN oficial en https://code.jquery.com También uso script_loader_tag para poder agregar algunos atributos de CDN.
Puedes usar el siguiente código:

// 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
fuente