Al añadir Javascript y CSS en tu página web de WordPress, deberás hacerlo con mucho cuidado, ya que el más mínimo error podría costarte muy caro y generarte muchos dolores de cabeza, en especial a lo referente con el mantenimiento del sitio.
En la actualidad existen múltiples formas de añadir Javascript y CSS, pero algunos métodos empleados no son adecuados. En tal sentido, en este artículo te enseñaremos como realizar el procedimiento de forma segura.
Una de las forma de añadir Javascript y CSS a WordPress es através de script y reglas CSS en el header o footer del tema. Además, otra método es a través del archivo functions.php con action hooks y plugins.
Pasos para añadir Javascript y CSS en WordPress
Insertar Javascript en WordPress
En primer lugar te explicaremos como insertar Javascript en tu sitio de forma acorde a través del fichero functions.php en el tema.
Por lo tanto, deberá añadir el siguiente código al fichero mencionado
- function incluir_javascript() {
- wp_register_script(‘validation_script’, plugins_url(‘validate.js’, __FILE__), array(‘jquery’),’3.3.1′, true);
- wp_enqueue_script(‘validation_script’);
- }
- add_action( ‘wp_enqueue_scripts’, ‘incluir_javascript’ );
En tal sentido, a través de esta codificación se validarán los campos de formulario de contacto.
Además en la segunda línea del código se describen varias funciones:
- $handle: Nombre del script
- $src: Sitio del fichero
- $deps: Array de dependencias a producir
- $ver: Número de versión del script
- $in_footer: En caso de true, el script se pondrá en cola en el footer. De ser false, se hará en el header
Insertar CSS en WordPress
Para añadir CSS en WordPress aplicaremos un proceso similar al anterior pero con un fichero de CSS. En tal sentido, podrás añadir nuevos estilos en el tema empleado. Por lo tanto, ubica el functions.php e inserta el siguiente código:
- function incluir_css() {
- wp_register_style(‘styles’, plugins_url(‘styles.css’, __FILE__));
- wp_enqueue_style(‘styles’);
- }
- add_action( ‘wp_enqueue_scripts’, ‘incluir_css’ );
Finalmente, deberás cambiar los parámetros en la función wp_register_style para establecer tus requerimientos.
También te puede interesar:
