BLACK FRIDAY: 50% DE DESCUENTO EN TODOS NUESTROS PLANES

Hosting WordPress Webempresa

Hooks en WordPress ¿cómo utilizarlos? Guía rápida

por | Sep 3, 2022 | Aprender WordPress

Hooks en WordPress cómo utilizarlos

Los Hooks de WordPress son uno de esos términos que seguramente has escuchado alguna vez y que posiblemente ya hayas usado al hacer modificaciones a en tu sitio web.

Es una técnica que se usa en programación, aunque no necesitas ser un programador/a para entender qué son y cómo usarlos en casos específicos.

Los ganchos son una forma de que un fragmento de código interactúe o modifique otro fragmento de código en puntos específicos y predefinidos, algo que a menudo se hace con “snippets WordPress“. Estos ganchos constituyen la base de cómo los plugins y los temas interactúan con el núcleo de WordPress, pero también son utilizados ampliamente por el propio núcleo.

En este artículo aprenderás un poco más sobre ese mundo oculto de los Hooks en WordPress y las posibilidades que se presentan cuando sabes cómo usarlos.

   Para qué sirven los Hooks en WordPress

 

¿Te imaginas que quieres añadir o cambiar alguna funcionalidad de WordPress y para ello tengas que modificar los archivos del core o núcleo de WordPress?

Es evidente que esto te traerá problemas ya que por un lado perderás todas las modificaciones que hayas hecho cuando actualices WordPress y por otro lado, la administración de tus cambios sería difícil de mantener.

A través de los Hooks en WordPress puedes cambiar, añadir, o eliminar funcionalidades que vienen con WordPress y hacerlo de manera ordenada y sin perder los cambios cuando se actualice WordPress.

El término “hook” se puede traducir como gancho y la siguiente imagen representa precisamente ese concepto, enganchamos código adicional al código del core de WordPress

 

Esquema funcionamiento Hooks en WordPress

 

Evidentemente, WordPress ya viene con estos “ganchos” preparados en lugares estratégicos para que se puedas añadir código personalizado.

   ¿Un plugin puede tener Hooks WordPress?

 

Efectivamente, los plugins puede usar WordPress Hooks, especialmente plugins que tienen mucha funcionalidad y que tendrán funcionalidad extendida por medio de otros plugins.

Descubre cómo puedes crear un plugin en WordPress con este tutorial.

Por ejemplo, en el caso del plugin de tienda WooCommerce, es un plugin con mucha funcionalidad y existen muchos plugins que extienden o modifican la funcionalidad de tienda que viene por defecto como pueden ser los métodos de pago adicionales, elementos adicionales en el detalle de producto, métodos de envío adicionales, etc.

   Cómo editar los Hooks en WordPress

 

Si estás construyendo un plugin, será parte del código de tu plugin, sin embargo lo más común es que se hagan modificaciones puntuales a tu sitio web que no merezcan hacer un plugin desde cero, por lo tanto puedes usar un plugin de snippets o puedes hacer las modificaciones en el archivo functions.php de tu tema hijo de WordPress.

A fin de cuentas el archivo functions.php de WordPress es el fichero que más “hooks” gestiona en una instalación de WordPress.

En el archivo functions.php puedes hacer cosas como:

  • Habilitar funciones como las imágenes destacadas de las Entradas.
  • Realizar la reescritura de URLs.
  • Gestionar las peticiones de Ajax.
  • Declarar las ubicaciones de los menús y áreas de widgets.
  • Declarar hojas de estilo CSS y scripts JavaScript.
  • Declarar los nuevos tipos de publicaciones y taxonomías.
  • Personalizar ajustes e interfaz del dashboard.

Entre otras acciones, aunque hay muchas más en el Codex de WordPress.

   Tipos de Hooks en WordPress

 

Existen básicamente dos tipos de “hooks WordPress” que son los Actions Hooks y los Filter Hooks.

La principal diferencia entre una acción y un filtro es:

  • La acción interrumpe el flujo de código para hacer algo, y luego vuelve al flujo normal sin modificar nada.
  • El filtro se utiliza para modificar algo de una manera específica para que la modificación sea utilizada por el código más adelante.

El “algo” al que se hace referencia es la lista de parámetros enviada a través de la definición del gancho.

  Actions Hooks

 

Ejecutas una acción cuando se lanza código adicional en un determinado punto, similar a lo que sería la ejecución de código por eventos.

Los action Hooks son “hooks” que ejecutan una acción pero que no devuelven ningún valor. Básicamente es agregar funcionalidad en un punto determinado del código de WordPress.

En la siguiente imagen veremos que en el archivo del core de WordPress se define los Actions Hooks con la función do_action(), sin embargo para usar los Hooks usaremos la función add_action().

 

Funcionamiento action hooks

 

La función de WordPress add_action() entonces es la función que usaremos, le pasaremos básicamente dos parámetros, el primero es el nombre del Hook y el segundo es el nombre de nuestra función personalizada en donde irá nuestro código que se añadirá al código de WordPress.

Esto sería lo básico, sin embargo para más información puedes consular la documentación oficial de add_action

Veamos esto con un ejemplo, el siguiente código agrega un archivo javascript a nuestro sitio web:

 

add_action("wp_enqueue_scripts", "web_insertar_js");
	function web_insertar_js(){
		wp_register_script('miscript', get_stylesheet_directory_uri(). '/js/script.js', array('jquery'), '1', true );
		wp_enqueue_script('miscript');  }

 

En el código anterior hemos usado el Hook wp_enqueue_scripts para añadir un archivo javascript, como puedes ver en la función add_action se hace referencia a la función web_insertar_js en donde esta toda la lógica para añadir el archivo script.js.

Este código simplemente añade a cola el nuevo script pero no modifica ningún tipo de valor de entrada.

Si estableces los nombres de las funciones demasiado genéricos podrían entrar en conflicto con las funciones nativas de WordPress o con las funciones declaradas por una extensión porque tendrían el mismo nombre.

  Filters Hooks

 

En programación pasar un filtro es hacer una modificación a algún dato, por ejemplo si quieres pasar un filtro a un texto, podría ser cambiar el texto por otro, cambiar el texto a mayúsculas, etc.

Los Filters Hooks, al igual que los Actions Hooks te permiten ejecutar código en un determinado punto, sin embargo en este caso la función tendrá obligatoriamente que devolver un valor modificado.

En la siguiente imagen vemos que en el archivo del core de WordPress se define los “Fiters Hooks” con la función apply_filter(), sin embargo para usar los Hooks usaremos la función add_filter().

 

Funcionamiento filter hooks

 

Para usar un filtro usaremos entonces la función de WordPress add_filter() y le pasaremos básicamente dos parámetros, el nombre del Hook y el nombre de la función que hará las modificaciones.

Para más información sobre el uso de “add_filter” puedes consultar la documentación oficial de add_filter.

Veamos esto con un ejemplo para modificar el enlace de leer más en el listado de entradas:

 

function web_modificar_leer_mas() {
	return ' Leer más '; }
add_filter( 'the_content_more_link', 'web_modificar_leer_mas' );

 

En el código anterior hemos usado el Hook the_content_more_link, el cual hace referencia a la función web_modificar_leer_mas dentro de esta función podemos hacer las modificaciones HTML al enlace de leer más y devolverlo modificado.

   Encontrar Hooks en WordPress

 

Lo ideal es buscar en el código de WordPress e ir viendo qué Hooks tengo disponibles para determinada funcionalidad, básicamente buscaría las funciones do_action y apply_filter, que como habíamos visto son las funciones de Actions Hooks y Filter Hooks.

Una forma alterna es buscar los Hooks por orden alfabético, para esto existe el sitio web WordPress a2z, que clasifica los Hooks para su fácil localización.

  Vídeo sobre los Hooks en WordPress

 

En el siguiente vídeo te hago un resumen de lo comentado en este artículo.

 

  Conclusiones

 

Como hemos visto la flexibilidad de WordPress se basa en los Hooks, a través de esta técnica de programación los plugins y temas extienden la funcionalidad de WordPress, pero también los Hooks te pueden servir para agregar una funcionalidad específica en tu archivo functions.php de tu tema.

Los hooks de WordPress son las funciones que utilizas por medio de fragmentos de código para cambiar la configuración por defecto de tu sitio WordPress. Si usas plugins como Code Snippets o HCFM, por ejemplo, que sepas que estás utilizando “hooks” en tu sitio web, de forma sencilla y controlada, aunque no debes confundirlos con las “acciones” o “filtros” que también añades al archivo de funciones de tu tema en uso. 😉

También te puede interesar:

¿Te ha resultado útil este artículo?

Hosting Divi - Wp Fácil - Webempresa