Como desactivar scripts y estilos

desenchufado

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
VALORA Y COMPARTE ESTE ARTÍCULO PARA MEJORAR LA CALIDAD DEL BLOG…
(7 votos, promedio: 5)

¿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.

16 comentarios en “Como desactivar scripts y estilos”

  1. Pingback: Bitacoras.com

  2. Interesantisimo… el plugin social que desarrollo "mete" su propio CSS en el header del theme… tenía pensado hacer esto opcional y, ahora que nos enseñas esto, lo incluire si o si en la próxima versión 😉

    saludos y gracias!

  3. Yo lo que hago es editar el plugin y borrar directamente la línea donde "inserta" la hoja css para después pegarlo en la css principal (hasta ahora, no me ha afectado en el funcionamiento del plugin).

    Pero es buen tip el que mencionas.

  4. Pingback: Como desactivar scripts y estilos | Ayuda WordPress

  5. Utilísimo el artículo. Muchas gracias por traducirlo.

    Pero creo que sería interesante, además de correcto, citar al menos el artículo original.

    Un saludo,

    Lucas.

      1. Fernando, no quiero entrar en polémica. Creo que eres una fuente de mucho valor para la comunidad WordPress en español. Pero en este caso, has hecho una traducción literal de un artículo. La pregunta es si alguien que no ha leído el post de Justin Tadlock sabría que tú no eres el autor de este texto, leyendo sólo tu artículo. Creo que la respuesta es evidente.

        No veo que cites la fuente. Veo que la enlazas, sin ni siquiera decir que en realidad la información la has sacado de ahí.

        Quizá sólo sean distintos puntos de vista de cómo hacer las cosas.

        De cualquier forma, gracias por hacer llegar esta información aún a más gente.

        1. Lucas, yo siempre enlazo dentro del contexto, siempre lo he hecho así. Lo del "vía" me parece una bobada. Son modos de verlo. Y no puedes decir que no enlazo porque lo hago, ni me atribuyo la autoría. Y bueno, literal literal no es la traducción, nunca las hago así. Procuro no dejar nada en el tintero de lo que quiero compartir pero siempre procuro hacerlo de un modo directo y aportando algo más. ¿Es que es malo compartir artículos en inglés traducidos para que la comunidad hispana pueda aprovecharlos? ¿sería mejor decir algo como "Justin ha escrito un post estupendo sobre como desactivar scripts y estilos, búscate la vida con algún traductor"?, enlazando, claro.

          Son maneras de verlo, y creo que no hay nada reprochable en el post, simplemente me parece mejor enlazar de este modo, en contexto. ¿Que a ti te gusta más poner un "Vía" o "traducido de … " pues lo respeto, pero no lo comparto.

          Estoy un poco harto de ver "citas" en texto desplazado, "vías" en small bajo una imagen, enlaces a la fuente en colores que ni se ven y cosas así.

          <small>por cierto Lucas, no carga tu blog</small>

  6. repacheco81 (11 come

    Yo para combinar los JavaScript utilizo el Plugin Speedy, en el panel de configuracion del plugin te permite que Js comprimir en uno solo y te puede ahorrar mas de un dolor de cabeza si no sabes php.

  7. Pingback: Como desativar scripts e estilos no wordpress | Ajuda Wordpress em Português

    1. No suelo tener tiempo, además de que pruebo muchas cosas para vosotros y este blog es el perjudicado de todos los experimentos de nuevos plugins, funciones, etc. Lo importante es que lo uses tu y el resto con tus sitios.

  8. No soy capaz de de añadir mas de js a la función, puedes poner un ejemplo donde suprimas varios, y si encuentras como eliminar la next-gallery te lo agrediría mucho. GRACIAS !!!

  9. Hola.

    Tengo un problema con unas cookies. Tengo el plugins GDPR, que gestiona los consentimientos pero no bloquea las cookies.

    Quiero bloquear algunas en concreto, hasta que me den el consentimiento, pero no lo consigo.

    Como podría hacerlo?

    Gracias!

Deja un comentario

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *

 

Ir arriba Ir al contenido