Actualizar versión de jQuery
Ejecuto WordPress versión 4.7.2 y utiliza jQuery versión 1.12. Necesito actualizar esta versión a una más reciente. Ya la he reemplazado con una versión nueva antes, pero cuando actualizo el núcleo de WordPress, se vuelve a reemplazar con la 1.12. ¿Cómo puedo cambiar la versión de jQuery que usa WordPress de forma permanente?

Advertencia: No deberías reemplazar la versión core de jQuery, especialmente en el panel de administración. Ya que muchas funcionalidades del núcleo de WordPress pueden depender de esta versión. Además, otros plugins podrían depender de la versión de
jQuery
incluida en el core.
Si estás seguro de que deseas cambiar la versión core de jQuery
, en ese caso puedes agregar el siguiente CÓDIGO en el archivo functions.php
de tu tema activo (incluso mejor si creas un plugin para esto):
function replace_core_jquery_version() {
wp_deregister_script( 'jquery' );
// Cambia la URL si deseas cargar una copia local de jQuery desde tu propio servidor.
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 versión core de jQuery
y en su lugar cargará la versión 3.1.1
desde el servidor de jQuery.
Además, aunque no es recomendado, puedes usar la siguiente línea adicional de CÓDIGO para reemplazar la versión de jQuery en wp-admin
también:
add_action( 'admin_enqueue_scripts', 'replace_core_jquery_version' );
De esta manera, incluso después de actualizar WordPress, tendrás la versión de jQuery
que deseas.
Una función ligeramente mejor:
La función replace_core_jquery_version
mencionada anteriormente también elimina el script jquery-migrate
agregado por el núcleo de WordPress. Esto es razonable, porque la versión más nueva de jQuery no funcionará correctamente con una versión más antigua de jquery-migrate
. Sin embargo, puedes incluir una versión más reciente de jquery-migrate
también. En ese caso, usa 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' );
}

¿Puedes simplemente eliminar la acción de functions.php si descubres que rompe tu tema? ¿Volverá a la versión original de jQuery o es un cambio permanente?

Si la función de callback de la acción wp_enqueue_scripts
solo actualiza jQuery y jQuery se está cargando desde otro lugar, entonces eliminar la acción restaurará el jQuery original. Sin embargo, a veces los navegadores almacenan en caché el CÓDIGO antiguo, dependiendo de la configuración de caché del servidor, por lo que deberás borrar la caché del navegador después de hacer eso para ver el cambio.

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 era correcto pero quería ir a lo seguro.

Esto obviamente no es permanente, ya que este cambio depende del CÓDIGO en sí, no se guarda nada en la base de datos. Así que al eliminar el CÓDIGO relacionado se volverá al estado anterior.

El script de migración para las versiones 3.x no funciona cuando los plugins/temas esperan una versión inferior a la 1.12. Más información aquí: https://wordpress.stackexchange.com/a/244543/75495

@cjbj por supuesto que ese es el caso. Sin embargo, la pregunta era sobre deshacerse de 1.12
, así que obviamente la respuesta no cubre eso.

He desarrollado un plugin para este problema específico. El plugin no interfiere con jQuery de WordPress ya que solo se carga en el front-end. Ver: jQuery Manager for WordPress
¿Por qué otra herramienta más de actualización/gestión/desarrollo/depuración de jQuery?
Porque ninguna de las herramientas de desarrollo te permite seleccionar una versión específica de jQuery y/o jQuery Migrate. Proporcionando tanto la versión de producción como la minificada. ¡Mira las características a continuación!
✅ Solo se ejecuta en el front-end, no interfiere con el admin/backend de WordPress ni con el personalizador de WP (por razones de compatibilidad) Ver: https://core.trac.wordpress.org/ticket/45130 y https://core.trac.wordpress.org/ticket/37110
✅ Activar/desactivar jQuery y/o jQuery Migrate
✅ Activar 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 puedes estudiarlo, aprender de él y contribuir.
Casi todos usan el handle incorrecto
WordPress en realidad usa el handle jquery-core, no jquery:
// 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 handle jquery es solo un alias para cargar jquery-core con jquery-migrate
Más información sobre alias: wp_register_script multiple identifiers?
La forma correcta de hacerlo
En mi ejemplo a continuación uso el CDN oficial de jQuery en https://code.jquery.com. También uso script_loader_tag para poder añadir algunos atributos del CDN.
Puedes usar el siguiente código:
// Front-end no se ejecuta en el admin de WP ni en el personalizador de WP (por razones de compatibilidad)
// Ver: https://core.trac.wordpress.org/ticket/45130 y 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 'Estamos en el Admin de WP o en el Personalizador de WP';
return;
}
else {
// Desregistrar jQuery core de WP, ver https://github.com/Remzi1993/wp-jquery-manager/issues/2 y https://github.com/WordPress/WordPress/blob/91da29d9afaa664eb84e1261ebb916b18a362aa9/wp-includes/script-loader.php#L226
wp_deregister_script( 'jquery' ); // el handle jquery es solo un alias para cargar jquery-core con jquery-migrate
// Desregistrar jQuery de WP
wp_deregister_script( 'jquery-core' );
// Desregistrar jQuery Migrate de WP
wp_deregister_script( 'jquery-migrate' );
// Registrar jQuery en el head
wp_register_script( 'jquery-core', 'https://code.jquery.com/jquery-3.3.1.min.js', array(), null, false );
/**
* Registrar jquery usando jquery-core como dependencia, para que otros scripts puedan usar el handle jquery
* ver https://wordpress.stackexchange.com/questions/283828/wp-register-script-multiple-identifiers
* Primero registramos el script y luego lo encolamos, ver por qué:
* https://wordpress.stackexchange.com/questions/82490/when-should-i-use-wp-register-script-with-wp-enqueue-script-vs-just-wp-enque
* https://stackoverflow.com/questions/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 );
