Agregar JavaScript a WordPress: Cómo hacerlo fácilmente

Las personas que usan WordPress deberían aprender más sobre JavaScript y cómo se usa para un sitio web. Para agregar JavaScript a WordPress, debe encontrar la forma más adecuada de implementarlo para su propio sitio web.

La investigación tiene una gran importancia, ya que una implementación incorrecta de JavaScript podría tener consecuencias que serán difíciles de solucionar.

¿Qué es un JavaScript de WordPress?

Un JavaScript de WordPress es una forma de agregar funciones adicionales a un sitio web sin ralentizarlo. JavaScript representa un lenguaje de programación que se ejecuta en el navegador del usuario. Este tipo de programación ofrece a los desarrolladores la posibilidad de agregar todo tipo de funciones a sus sitios, como reproductores de video integrados, calculadoras u otros servicios. La pieza de código JavaScript simplemente debe copiarse y pegarse en el código del sitio web.

¿Por qué debería agregar JavaScript personalizado en WordPress?

Existen múltiples razones por las que debe agregar JavaScript a WordPress, pero para hacerlo, debe saber cómo está codificado el sitio web. Al codificar un sitio web de WordPress, hay tres elementos que pueden ayudarlo:

• HTML
• CSS
• JavaScript

Para crear una base muy sólida para el sitio de WordPress, puede usar HTML y CSS. Aunque son excelentes para sentar las bases del sitio web, son limitados en términos de alterar el comportamiento del sitio. Cuando desee que su sitio actúe de una manera específica, puede usar JavaScript para realizar una de las siguientes acciones:

• Cambiar, ocultar o mostrar ciertos elementos HTML en el sitio web
• Agregar valores a las variables CSS, así como ejecutar operaciones que son más complejas (fusionar variables o hacer que un elemento interactúe haciendo clic)
• Cambiar el diseño del tema de WordPress agregando otro bloque de código dentro de él
• Modificar una determinada funcionalidad de un plugin de WordPress
• Mejorar el sitio web con contenido dinámico (animaciones, videos, etc.)
• Incluir un elemento externo en el sitio web (API de terceros)

Todo esto, y más, se puede hacer usando JavaScript.

Uso de Insertar encabezados y pies de página para agregar JavaScript

Al agregar JavaScript a WordPress, simplemente debe copiar y pegar el bloque de código JavaScript en el sitio web. Esta simple acción agrega una herramienta de terceros al sitio web, ya sea un reproductor de video u otro elemento. Estos fragmentos de código se agregaron justo debajo de la sección del encabezado o justo antes de la etiqueta en el código principal del sitio web. Esto influye en dónde se colocará el elemento. Para activar este complemento que se llama Insertar encabezados y pies de página, primero debe instalarlo.

Para activarlo después de la instalación, simplemente debe acceder a Configuración y luego a la página Insertar encabezados y pies de página. Hay dos casillas diferentes que puede marcar: una para el encabezado y otra para el pie de página. Una vez que haya activado este complemento, puede simplemente pegar el fragmento de código JavaScript y hacer clic en guardar. Debido a que el complemento está activado, el fragmento de código que pegó se cargará automáticamente para todas las páginas de su sitio web. Este es el conocimiento más básico que necesita tener para agregar JavaScript a WordPress.

Deshabilitar el filtrado de WordPress

Cuando use JavaScript en WordPress, también debe deshabilitar el bloqueo de etiquetas de secuencias de comandos de JavaScript. Esta configuración se puede encontrar en wp-config.php, que se encuentra en el directorio web raíz. Para habilitar las etiquetas personalizadas, agregue esta línea de código allí:

define( 'CUSTOM_TAGS', true );

Una vez que vaya a la página functions.php, copie y pegue este fragmento de código en su código base:

function add_scriptfilter( $string) {global $allowedtags;$allowedtags['script'] = array( 'src' => array() );return $string;}add_filter( 'pre_kses', 'add_scriptfilter' );

Consejo adicional: el uso de este método significa que deshabilita la función de seguridad en su sitio web, para cualquier nivel de permiso de usuario. Use este método solo si confía profundamente en sus autores. Habilitar la etiqueta del script a veces es arriesgado de esta manera.

Aprenda a usar el complemento Script n Styles

Puede agregar JavaScript a WordPress usando un complemento. Normalmente, tendría que cargar JavaScript dentro de las etiquetas y. Para cargar JavaScript globalmente, se puede usar un complemento. Uno receptivo es Script n Styles. Puede incluir scripts en todo el sitio web o incluirlos en la página o incluso en el nivel de publicación. También puede modificar los permisos de los usuarios. Los autores pueden publicar publicaciones y activar JavaScript y los colaboradores pueden guardar las publicaciones sin publicarlas.

Usar campos personalizados avanzados

Si se pregunta cómo agregar JavaScript a WordPress de la manera más fácil, este complemento podría ser la solución. Una vez que instale y active el complemento, puede acceder a la opción Campos personalizados en el menú administrativo. Luego, puede hacer clic en Agregar nuevo. El objetivo es agregar un campo al que puedan acceder los administradores y que pueda incrustar un archivo fuente JavaScript o un código JavaScript dentro de las etiquetas.

• El primer paso es nombrar el grupo de campo. Esto se puede hacer habilitando una regla que muestre esta opción si el usuario que inicia sesión como Administrador. Esto significa que solo el administrador puede agregarlos en el sitio.
• Los campos deben mostrarse debajo del área de contenido, lo que significa que selecciona Estándar cuando se trata de seleccionar el estilo del Grupo de campos. Establezca el formato del campo en "Convertir HTML en etiquetas". Esto dará como resultado una buena salida, de lo contrario, podría traducirse mal.
• Agregue el siguiente código dentro de header.php:

<?php the_field('header_script'); ?>

Esto debe agregarse antes.

<?php the_field('footer_script'); ?>

Esto debe agregarse antes.

• Guarde los archivos de plantilla, actualice la página y haga clic en Publicar.

La página se publicará con el JavaScript agregado. Los Campos personalizados avanzados son una opción adecuada si desea más funcionalidad para los usuarios, páginas que ya están publicadas, etc.

Oye, ¿sabías que los datos también pueden ser hermosos?

wpDataTables puede hacerlo de esa manera. Hay una buena razón por la que es el plugin de WordPress n.º 1 para crear tablas y gráficos receptivos.

Un ejemplo real de wpDataTables en la naturaleza

Y es muy fácil hacer algo como esto:

1. Usted proporciona los datos de la tabla.
2. Configúralo y personalízalo
3. Publicarlo en una publicación o página

Y no solo es bonito, sino también práctico. Puede crear tablas grandes con hasta millones de filas, o puede usar filtros y búsquedas avanzados, o puede volverse loco y hacerlo editable.

“Sí, pero me gusta demasiado Excel y no hay nada de eso en los sitios web". Sí, lo hay. Puede usar formato condicional como en Excel o Google Sheets.

¿Te dije que también puedes crear gráficos con tus datos? Y eso es solo una pequeña parte. Hay muchas otras características para ti.

Pensamientos finales sobre cómo agregar JavaScript a WordPress 

Estos consejos deberían ser suficientes para enseñarle cómo agregar JavaScript a WordPress de una manera fácil, sin encontrar ningún problema. Después de hacerlo una vez, la segunda vez será mucho más fácil y requerirá menos tiempo.

Si disfrutó leyendo este artículo sobre cómo agregar JavaScript a WordPress, debe consultar este sobre cómo restablecer WordPress.

También escribimos sobre algunos temas relacionados, como cómo cambiar la URL de WordPress, cómo incrustar un video en WordPress, cómo editar HTML en WordPress, cómo duplicar una página en WordPress, cómo editar los roles de usuario de WordPress y cómo agregar una imagen destacada de WordPress. .