Como desactivar scripts y estilos

Hay muchos plugins y themes que añaden JavaScript y CSS a tu sitio. Esto, que en sí mismo no es malo, cuando usas varios plugins de este tipo pueden hacer verdaderas perrerías con tu sitio, mostrando una versión lamentable del mismo cuando interfieren varios estilos CSS o scripts.

Afortunadamente WordPress dispone de un sistema propio que permite anular estos scripts y estilos.

En este ejemplo se usan dos plugins muy populares, Contact Form 7 y WP-PageNavi, pero puedes aplicarlo a otros similares, como Sociable, que también peca de lo mismo.

La cruda realidad

No todos los plugins hacen bien el trabajo cargando scripts y estilos, muchos de ellos solo piensan en su funcionalidad, sin tener en cuenta que tendrán que convivir con otros plugins, con tu theme, incluso con WordPress. Muchos desarrolladores meten «lo suyo» y luego te tienes que buscar la vida si hay problemas, incluso recomendándote (cuando les preguntas) que desactives los otros plugins o «cambies de theme» (verídico).

No todos los plugins usan métodos adecuados para la carga de scripts y estilos. La mayor parte de las ocasiones es porque no dominan dos importantes funciones de WordPress: wp_enqueue_script() y wp_enqueue_style(). Si el autor de un plugin/theme no usa estas funciones mejor búscate otro plugin/theme o anímale a hacerlo. Lo que hacen es permitir al resto convivir con su código.

Una vez tengas claro que scripts o CSS quieres desactivar ya te puedes poner manos a la obra …

Desactivando JavaScript

En el ejemplo vamos a desactivar el Javascript del plugin Contact Form 7. Lo primero que tenemos que hacer es encontrar la llamada al script. Para eso abrimos el fichero wp-contact-form-7.php en un editor de texto y buscamos la cadena wp_enqueue_script. Encontraremos lo siguiente:

wp_enqueue_script( 'contact-form-7', wpcf7_plugin_url( 'contact-form-7.js' ), array('jquery', 'jquery-form'), WPCF7_VERSION, $in_footer );

La llamada al Javascript del plugin es, en consecuencia, contact-form-7. Ahora ya podemos cerrar el archivo y seguir adelante.

A continuación abrimos el fichero functions.php de tu theme y añadimos este código PHP:

add_action( 'wp_print_scripts', 'my_deregister_javascript', 100 );
function my_deregister_javascript() {
	wp_deregister_script( 'contact-form-7' );
}

Guardamos el archivo y lo que conseguimos es que el script no se vuelva a cargar. Puedes desactivar (desregistrar) tantos scripts como quieras con esta función.

Desactivando estilos

Para este ejemplo vamos a desactivar la hoja de estilos del plugin WP-PageNavi. Y es que es casi mejor siempre añadir estilos en tu CSS, y no que los coja de las carpetas de los plugins, a veces actualizan los plugins con cambios de CSS que pueden destrozar tu theme.

Lo primero que tenemos que hacer es abrir el fichero wp-pagenavi.php en un editor de texto y buscar wp_enqueue_style. Lo que encontramos es este código:

wp_enqueue_style('wp-pagenavi', get_stylesheet_directory_uri().'/pagenavi-css.css', false, '2.50', 'all');

Y también este otro:

wp_enqueue_style('wp-pagenavi', plugins_url('wp-pagenavi/pagenavi-css.css'), false, '2.50', 'all');

Lo que estamos buscando es como Page Navi gestiona los estilos. Una vez lo hemos encontrado ya lo podemos cerrar (tras analizarlo) y añadir lo siguiente al fichero functions.php de tu theme:

add_action( 'wp_print_styles', 'my_deregister_styles', 100 );
function my_deregister_styles() {
	wp_deregister_style( 'wp-pagenavi' );
}

Con esto desactivamos la hoja de estilos de este plugin. Como antes, puedes «desregistrar» cuantos estilos quieras con esta función.

Trucos para mejorar la tarea

Ahora que hemos desactivado scripts y estilos hay algunas cosas que podemos hacer para mejorar esta técnica o darle otros usos:

• Coloca los estilos desactivados (o los que quieras cambiar) al final de tu hoja de estilos (style.css), añadiendo algún comentario que los identifique, que muestre a qué afectan.
• Combina varios scripts en un solo archivo y cárgalos tu mismo.
• Usa tags condicionales para afinar el control de la carga de estilos y/o scripts.
• Si desactivas algo puede que el plugin/theme deje de funcionar correctamente. La mayoría de los estilos puedes añadirlos a la hoja de estilos de tu theme para así no cargar varias hojas de estilos. Pero con el Javascript es distinto, con este tipo de código solo combina varios scripts si sabes realmente lo que estás haciendo

¿Te gustó este artículo? ¡Ni te imaginas lo que te estás perdiendo en YouTube!

AVISO: Esta publicación es de hace 3 años o más. Si es un código o un plugin podría no funcionar en las últimas versiones de WordPress, y si es una noticia podría estar ya obsoleta. Luego no digas que no te hemos avisado. ¡Ah! ¿te funciona? pues entonces no he dicho nada :)