Si está desarrollando un tema de WordPress desde cero o cambiando un tema existente, es posible que necesite saber cómo agregar correctamente un archivo JavaScript.

Si está pensando en utilizar el método de la vieja escuela de Web 1.0 vinculando el JavaScript a su cabeza, esta es una mala idea ya que es una era de Web 2.0 en estos días donde la gente tiene sitios web dinámicos.

Debe comprender el concepto del Codex de temas de WordPress y cómo poner en cola un archivo JavaScript y CSS. Ya hemos hablado de añadir un archivo CSS.

Este tutorial le muestra cómo agregar dinámicamente un archivo JavaScript a un tema de WordPress.

Para cumplir con el último estándar de codificación, siempre debe seguir el Codex de WordPress, que se actualiza de vez en cuando. Quizás se esté preguntando si necesita o no habilidades de programación.

Si ha buscado este artículo, probablemente ya conozca los conceptos básicos del desarrollo de temas de WordPress.

Aprenda el Codex de puesta en cola de JavaScript

Muchas funciones similares pueden ocurrir durante el desarrollo de un tema de WordPress. Como puede ver, puede usar la misma función para agregar un archivo JavaScript que para agregar un archivo CSS.

Aunque hay una pequeña diferencia porque JavaScript tiene muchas categorías, todo es sencillo. Deja que te enseñe

wp_enqueue_script( $handle, $src, $deps, $ver, $in_footer );

Déjame explicarte todos los parámetros.

  1. $ manejar: – Es el nombre del archivo JavaScript.
  2. $ src: – La dirección del archivo.
  3. PSdeps: – Si desea crear una matriz, puede hacerlo.
  4. $ ver: – Puede mencionar la versión de JavaScript.
  5. $ in_footer: – De forma predeterminada, el valor es falso, lo que significa que el archivo JavaScript se agregará al encabezado.

Ahora mira este ejemplo.

wp_enqueue_script( 'new-script', get_template_directory_uri() . '/js/new-script.js/', array() );

El nombre del archivo es “mi-guión” y esta en uno “js” Carpeta.

Nota: si desea cargarlo desde el área del pie de página para mejorar el rendimiento del sitio web, puede especificar que $ in_footer Vale la pena “cierto.”

El código se transforma de la siguiente manera.

wp_enqueue_script( 'new-script', get_template_directory_uri() . '/js/new-script.js/', array(), true );

La tarea aún no ha terminado. Para que funcione, debe crear una función y usar una acción. Si ya ha agregado un archivo CSS, puede usar la misma función.

Déjame mostrarte el código completo.

functionmy_new_scripts{
wp_enqueue_script( 'new-script', get_template_directory_uri() . '/js/new-script.js/', array(), true );
}
add_action( 'wp_enqueue_scripts', 'my_new_scripts' );

Ahora surge la pregunta, ¿dónde necesita agregar dicho código?

Como ya sabe, el archivo functions.php de su tema de WordPress es responsable de todas las funciones de un sitio web de WordPress. Agregue el código al archivo y guárdelo.

Con suerte, si cambia su tema existente, cPanel tendrá fácil acceso al archivo functions.php. Casi todas las empresas de hosting de WordPress en estos días ofrecen acceso a cPanel.

Solo ve a Administrador de archivos >> wp-content >> temas >> nombre del tema >> functions.php. Haga clic derecho para seleccionar Editar y listo.

Cómo agregar correctamente un archivo JavaScript a un tema de WordPress

La edición de código puede dar miedo si no está familiarizado con las funciones de WordPress y PHP.

Para un desarrollador de temas de WordPress, agregar un nuevo archivo JavaScript puede hacer que el sitio web sea más dinámico que antes. Es posible que los necesite para la versión móvil del menú de navegación.

Dependiendo de sus necesidades, puede utilizar un archivo JavaScript.

Espero que sea difícil agregar un archivo JavaScript a un tema de WordPress

Después de un tiempo, la gente se molesta al leer sobre la codificación de WordPress. Sin embargo, no es necesario que un usuario normal de WordPress se ocupe de los códigos.

WordPress es una plataforma fácil de usar diseñada para no expertos en tecnología. Puede comprar un tema de WordPress en el mercado.

Hay millones de temas en la web.

Conclusión

El tutorial está dirigido a usuarios avanzados o personas que desean obtener más información sobre el desarrollo de temas de WordPress. Siempre es una buena idea mejorar sus habilidades de codificación.

Espero que agregar un archivo JavaScript no sea tan difícil como dice la gente.

Echa un vistazo a estos 3 principales servicios de hosting de WordPress: