Cómo desactivar estilos o scripts concretos

Esta es una función avanzada, para poder usarla es necesario que tengas conocimientos básicos de PHP y de WordPress.

Para desactivar un script o un estilo de forma global, tan solo tienes que añadir su handle en estas opciones:

En esas dos opciones añadiríamos, separados por comas, todos los handles de scripts y estilos que queremos bloquear.

El handle se puede encontrar mirando el código fuente del plugin que lo carga. Si no lo encuentras, puedes añadir temporalmente este código en el functions.php para que se muestre un listado de handlers en la web.

Recuerda borrarlo cuando encuentres el handle que buscabas.

add_action( 'wp_print_scripts', function () {
	global $wp_scripts;

	foreach ( $wp_scripts->queue as $handle ) {
		echo $handle . ' | ';
	}
} );

add_action( 'wp_print_styles', function () {
	global $wp_styles;

	foreach ( $wp_styles->queue as $handle ) {
		echo $handle . ' | ';
	}
} );

Cómo activar el script o estilo en una página concreta

En el paso anterior hemos visto cómo bloquear la carga global de un estilo o script cargado por un plugin, por el theme o por el propio WordPress. Ahora vamos a ver cómo, una vez bloqueado, se puede habilitar de forma individual en páginas o entradas concretas.

Vamos a suponer que hemos configurado el handle contact-form-7 para que no se cargue nunca el script y los estilos del plugin Contact Form. Ahora queremos que se muestre solo en la página de contacto. Para hacerlo, tendríamos que:

1. Instalar un child theme

Lo necesitas porque vamos a editar el fichero functions.php. Con esto, prevenimos la pérdida de las modificaciones cuando se actualice Wasabi a una nueva versión. Puedes hacerlo siguiente este tutorial: https://wasabitheme.com/documentacion/art/que-es-un-child-theme-y-como-se-usa-con-wasabi/

2. Añadir unas líneas similares a estas en el fichero functions.php del child theme:

add_filter( 'wasabi_script_block_bypass_handlers', function () {
	if ( is_page( 123 ) ) {
		return ['contact-form-7'];
	}

	return [];
} );

add_filter( 'wasabi_style_block_bypass_handlers', function () {
	if ( is_page( 123 ) ) {
		return ['contact-form-7'];
	}

	return [];
} );

¿Qué hace este código?

  1. Interfiere los filtros de wasabi_script_block_bypass_handlers y wasabi_script_block_bypass_handlers de Wasabi Theme. Estos filtros permiten devolver un array de los handles (en formato string) que tenemos que permitir insertar, aunque se haya configurado su exclusión en los ajustes de WPO de Wasabi.
  2. En la función is_page() verificamos que nos encontramos en una página concreta. Suponemos que la página con ID 123 corresponde a la de contacto en el ejemplo.
  3. Si is_page(123) es verdadero, suponemos que nos encontramos dentro de la página de contacto, por lo que deberíamos devolver el handle del script/estilo de Contact Form 7 en el array de handles a permitir.
  4. Si is_page(123) es falso, devolvemos un array vacío, lo que significa que no queremos permitir ninguno de los scripts/estilos configurados en los ajustes WPO de Wasabi.


Otro tipo de contenido en el blog de Wasabi