Cómo agregar javascript o estilos a tu theme WordPress, de manera correcta.

Hay una manera específica para agregar scripts en el tu tema, para prevenir conflictos con plugins o el tema “parent” cuando armamos un child, como vimos antes. Ocurre distinto, muches desarrolladores “llaman” sus scripts directamente desde el header.php o footer.php.

Asimismo de esta manera dejamos listo nuestro theme para poder distribuirlo, incluyendo los scripts de esta manera se vuelve posible armar childs.

👎 Manera incorrecta:
Como dijimos no conviene cargar los .js desde el header.php o footer.php de la siguiente manera:

<script src="https://tusitioweb.com/wp-content/themes/tutema/js/script.js"></script>

Suele causar conflictos con otros plugins y hardcodear, hacer las cosas manualmente cuando estamos trabajando en un CMS no es buena idea.

👍 Manera correcta:
La mejor manera es agregar los scripts desde el functions.php del theme usando la función wp_enqueue_script, la acción de cargar javascript nos evita varios problemas ya conocidos.

Ejemplo:

wp_enqueue_script($handle = 'nuestro-script', $src = get_template_directory_uri() . '/js/script.js', $deps = array(),$ver = false, $in_footer = false );

El código anterior cargará el archivo script.js en nuestro theme, como pueden ver se pueden agregar dependencias, por ejemplo es probable que nuestro script necesite jQuery.

Entonces $handle es el nombre que le daremos interno a este script cargado, $src es la ruta donde se encuenta, $deps es la dependencia que decíamos, si antes creamos el $handle = “jQuery” lo hubieramos podido agregar en la línea de “nuestro-script” en $deps, $ver es por si necesitamos explicitar la version y por ultimo $infooter define si cargaremos en el script al principio o al final, en el header antes del <body> o en el footer del sitio, al final de la carga de la página.

Técnicamente podemos llamar la funcion wp_enqueue_script() en cualquier parte del tema o de un plugin, pero si estás cargando funciones globales vas a querer que estén en el functions.php de tu tema o es un archivo separado encargado de llamar a los scripts de tu sitio. Pero si estás sólo buscando cargar un script específico, como un carousel conviene de esta manera.

Fuentes:
https://developer.wordpress.org/reference/functions/wp_enqueue_script/
https://www.wpexplorer.com/javascript-wordpress/

Deja una respuesta

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