Los Hooks en WordPress son uno de esos términos que seguramente has escuchado alguna vez y que, sin saberlo, ya hayas usado al hacer modificaciones en tu sitio web.
En esta breve guía te explico ¿qué son los Hooks en WordPress?, y ¿cómo utilizarlos?, para explotar su potencial en tu web.
El uso de “ganchos” es una técnica utilizada en programación, aunque no necesitas saber programar para entender qué son y cómo aprovecharlos en casos específicos.
Los ganchos son la 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. 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.
Tabla de contenidos
¿Qué es un Hook en WordPress?
Un “hook” en WordPress sirve para ejecutar funciones adicionales en momentos específicos dentro del flujo de ejecución de WordPress, sin tener que realizar cambios en el código fuente del sitio web.
Los dos tipos principales, que verás desarrollados más abajo, son Actions y Filters.
Los Actions permiten ejecutar funciones en determinados puntos del código fuente, a modo de disparadores, por ejemplo, para añadir contenido tras la publicación de un artículo.
Los Filters sirven para modificar datos o resultados de funciones antes de que se procesen o impriman en pantalla, para cambiar un título, resaltar palabras o mostrar u ocultar partes de una publicación.
Casos prácticos de aplicación de Hooks
Gracias a acciones y filtros insertados estratégicamente, puedes ejecutar funciones adicionales para extender las capacidades de WordPress según tus necesidades.
Entre los casos de uso más destacados se encuentran la redirección de URL en WordPress para mantener el posicionamiento SEO al cambiar slugs.
También la personalización visual mediante cambios en HTML y CSS, la importación y exportación de contenidos entre diferentes webs WordPress, el poder integrar con API externas para extraer contenido automáticamente, y cualquier modificación que quieras realizar tanto en backend como en el frontal del sitio.
- Redireccionar URL mediante un filtro al slug en WordPress, de las Entradas para crear redirecciones y así evitar pérdida de posicionamiento tras un cambio de URL.
- Personalización de temas mediante actions para ejecutar código CSS adicional o añadir widgets en zonas específicas sin modificar archivos del tema.
- En SEO para mejorar títulos, metadescripciones o para el uso de microdatos con actions y filters y así tener un mejor posicionamiento.
- Para importar o exportar contenido con hooks personalizados, ya que es más sencillo para crear importadores y exportadores de contenido entre diferentes WordPress.
Gracias a la arquitectura de hooks, los desarrolladores y usuarios avanzados pueden ampliar fácilmente el comportamiento de WordPress según sus necesidades.
Una técnica para no modificar el núcleo de WordPress
¿Te imaginas que quieres añadir o cambiar alguna funcionalidad de WordPress y para ello tienes que modificar los archivos del core o núcleo de WordPress?
Es evidente que esto te traerá problemas porque, 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, enganchar código adicional al código del core de 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?
La técnica de los “hooks” puede ser usada también por plugins, especialmente aquellos que tienen muchas funcionalidades y que aportan acciones extendidas por medio de otros plugins.
Por ejemplo, en el caso del plugin de tienda WooCommerce, tiene muchas funcionalidades y existen otros que extienden o modifican la funcionalidad de tienda que viene por defecto, como pueden ser los métodos de pago adicionales en WooCommerce, elementos añadidos en el detalle de producto, métodos de envío adicionales, etc.
¿Dónde realizar las modificaciones?
Si estás construyendo un plugin, será parte del código de este; sin embargo, lo más común es que se hagan modificaciones puntuales a tu sitio web que no merezcan ser realizadas con un plugin desde cero, por lo tanto, puedes usar uno de snippets o hacer las modificaciones en el archivo functions.php de tu tema hijo.
A fin de cuentas, el archivo functions.php 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 URL.
- 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
Como has podido leer en el segundo punto del artículo, existen básicamente dos tipos de “hooks” 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 añadir una funcionalidad en un punto determinado del código de WordPress.
En la siguiente imagen puedes ver que en el archivo del núcleo de WordPress se define los Actions Hooks con la función do_action(); sin embargo, para usar los Hooks se hace uso de la función add_action().
La función de WordPress add_action() entonces es la función que se utiliza pasándole básicamente dos parámetros, el primero es el nombre del Hook y el segundo es el nombre de la función personalizada en donde irá el código que se añade 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
Te muestro esto con un ejemplo: el siguiente código añade un archivo JavaScript al 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 se ha utilizado 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 está 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.
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 te muestro que en el archivo del núcleo de WordPress se define los “Fiters Hooks” con la función apply_filter(), sin embargo, para usar los Hooks se puede utilizar la función add_filter().
Para usar un filtro se utiliza la función de WordPress add_filter() y se le pasan 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.
Te muestro con un ejemplo cómo 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 se ha utilizado usado el Hook the_content_more_link, el cual hace referencia a la función web_modificar_leer_mas dentro de esta función se pueden hacer las modificaciones HTML al enlace de leer más y devolverlo modificado.
Localizando los Hooks
Lo ideal es buscar en el código de WordPress e ir viendo qué Hooks hay disponibles para determinada funcionalidad, básicamente se trata de buscar las funciones do_action y apply_filter, que como has visto, son las funciones de Actions Hooks y Filter Hooks.
En el código de WordPress hay varios lugares donde se pueden localizar los hooks utilizados para extender la funcionalidad del CMS.
- La documentación oficial del Codex de WordPress incluye una lista de muchas acciones y filtros muy utilizados.
- El sitio Theme Hook Alliance recopila una gran lista de hooks populares en temas de WordPress para poder personalizar el frontal del sitio.
- Muchos temas incorporan hooks propios en sus plantillas y archivos PHP para facilitar la edición u funcionamiento del tema. Se pueden buscar llamadas apply_filters o do_action, entre las más comunes.
- Buscando en el código fuente del sitio web, puedes encontrar todos los hooks utilizados tanto por el Tema en uso como por los diferentes plugins instalados que los usen. Por ejemplo, en wp-includes o en wp-admin mediante IDE que permitan búsqueda.
- Hay plugins como Yoast SEO en WordPress, WooCommerce, etc., que se suelen localizar hooks comunes para after_save_post, edición con JavaScript, integración de API, etc.
- También hay plugins que incorporan listados amplios de hooks disponibles como Admin Columns Pro o Code Reference y que puedes encontrar en el directorio de plugins de WordPress.org fácilmente.
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 del uso de hooks en WordPress.
Conclusiones
Como has podido ver, la flexibilidad de WordPress se basa en los Hooks, ya que a través de esta técnica de programación los plugins y temas extienden la funcionalidad de WordPress, pero también pueden servir para añadir una función específica en tu archivo functions.php del tema.
Los hooks son las funciones que utilizas por medio de trozos 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.
Te sirven para insertar fragmentos de código en WordPress de forma segura y sencilla, ampliando y potenciando las funcionalidades predeterminadas del CMS. Estos imitan unos “ganchos” sobre los que luego puedes “colgar” nuevos comportamientos, sin editar archivos del núcleo de WordPress.
Se clasifican en hooks de acciones y hooks de filtros. Los primeros ejecutan código personalizado en determinados eventos durante la carga de WordPress, como publicaciones, guardado de contenido, inicio de sesión, etc. Los filtros modifican datos que fluyen por WordPress, como el contenido mismo de los artículos, sin afectar los archivos principales.
La magia de los hooks se centra precisamente en esta posibilidad de extender y mejorar WordPress, directamente desde el tema o con plugins. Por ejemplo, se puede añadir marcado HTML, cargar estilos y scripts adicionales, validar envíos de formularios, guardar información en la base de datos o modificar títulos y metadatos dinámicamente.
Con los hooks puedes transformar la experiencia de usuario y las capacidades del administrador, potenciando infinitas combinaciones de personalización avanzada muy por encima de las restricciones del panel de administración del CMS. Sin ellos, adaptar WordPress resultaría una tarea mucho más laboriosa y limitada.
¿Te ha resultado útil este artículo?
Soporte técnico WordPress en Webempresa y ponente habitual en Meetups y WordCamps de América.
