{"id":33694,"date":"2020-05-30T03:00:50","date_gmt":"2020-05-30T10:00:50","guid":{"rendered":"https:\/\/kinsta.com\/?p=72202"},"modified":"2023-08-23T17:28:41","modified_gmt":"2023-08-23T15:28:41","slug":"wordpress-hooks","status":"publish","type":"post","link":"https:\/\/kinsta.com\/es\/blog\/wordpress-hooks\/","title":{"rendered":"Entrenamiento de WordPress Hooks: \u00bfC\u00f3mo usar acciones, filtros y ganchos personalizados?"},"content":{"rendered":"

Los ganchos de WordPress son una de las herramientas m\u00e1s importantes para tener en el arsenal<\/a> de un desarrollador de WordPress<\/a>. Son la base del desarrollo de plugins y temas de WordPress. Puedes usar los muchos ganchos incorporados de WordPress para \u00abengancharte\u00bb al n\u00facleo de WordPress con tu c\u00f3digo personalizado y hacer<\/strong> o modificar<\/strong> algo.<\/p>\n

Hay dos tipos de ganchos de WordPress: Acciones<\/strong> y Filtros<\/strong>. Los ganchos son tan comunes que hasta el n\u00facleo de WordPress los usa extensamente por s\u00ed mismo. WordPress tambi\u00e9n incluye una forma de definir tus propios ganchos personalizados<\/strong> para que otros desarrolladores puedan engancharse a tu c\u00f3digo.<\/p>\n

Aprender c\u00f3mo funcionan las acciones, los filtros y los ganchos personalizados es esencial para dominar el desarrollo de WordPress.<\/p>\n

La primera mitad de este art\u00edculo cubre los fundamentos de los ganchos de WordPress y explica c\u00f3mo funcionan con m\u00faltiples ejemplos. En la segunda mitad, aprender\u00e1s c\u00f3mo puedes usar los ganchos para personalizar WordPress, crear tus propios ganchos personalizados y usarlos para construir tus propios plugins extensibles.<\/p>\n

\u00bfSuena emocionante? \u00a1Vamos a sumergirnos!<\/p>\n

<\/div><\/kinsta-auto-toc>\n

\u00bfQu\u00e9 son los ganchos de WordPress?<\/h2>\n

Una p\u00e1gina de WordPress<\/a> est\u00e1 ensamblada por toneladas de funciones y consultas a bases de datos. El n\u00facleo de WordPress, los plugins y el tema trabajan juntos para producir los elementos de la p\u00e1gina como texto, im\u00e1genes<\/a>, scripts y estilos. Una vez ensamblados, el navegador los pone todos juntos y muestra la p\u00e1gina.<\/p>\n

Los ganchos de WordPress te permiten \u00abengancharte\u00bb a este proceso de construcci\u00f3n en ciertos puntos y ejecutar tu c\u00f3digo personalizado. La funci\u00f3n principal de los ganchos es permitirte modificar o a\u00f1adir caracter\u00edsticas a WordPress sin tocar los archivos centrales<\/a>.<\/p>\n

\"Los
Los ganchos te ayudar\u00e1n a extender WordPress con tu propio c\u00f3digo<\/figcaption><\/figure>\n

La API del plugin de WordPress<\/a> potencia la funcionalidad de los ganchos de WordPress. Los ganchos se utilizan llamando a ciertas funciones de WordPress llamadas Funciones de Gancho<\/strong> en instancias espec\u00edficas durante el tiempo de ejecuci\u00f3n de WordPress.<\/p>\n

Usando las funciones de gancho, puedes agrupar tu c\u00f3digo personalizado dentro de una funci\u00f3n de callback <\/strong>y registrarlo con cualquier gancho. Una vez registrado, esta callback se ejecutar\u00e1 dondequiera que est\u00e9 el gancho, permiti\u00e9ndote aumentar o reemplazar las funciones predeterminadas de WordPress.<\/p>\n

La posici\u00f3n del gancho en el proceso de ejecuci\u00f3n del c\u00f3digo es un factor importante. Aprender\u00e1s m\u00e1s sobre su importancia en las pr\u00f3ximas secciones.<\/p>\n\n

Dos tipos de ganchos de WordPress: Acciones y Filtros<\/h3>\n

WordPress incluye dos tipos de ganchos llamados Acciones<\/strong> y Filtros<\/strong>. Las Acciones te permiten hacer<\/strong> algo en ciertos puntos predefinidos en el tiempo de ejecuci\u00f3n de WordPress, mientras que los Filtros te permiten modificar<\/strong> cualquier dato procesado por WordPress y devolverlo.<\/p>\n

Las acciones se definen en el c\u00f3digo de WordPress como:<\/p>\n

do_action( 'action_name', [optional_arguments] );<\/code><\/pre>\n
La cadena action_name<\/code><\/strong> es el nombre de la acci\u00f3n. Puedes especificar la variable [optional_arguments]<\/code><\/strong> para pasar argumentos adicionales a la funci\u00f3n de callback. Si no se especifica este campo, entonces su valor por defecto estar\u00e1 vac\u00edo.<\/p>\n
Ejemplo:<\/strong> La acci\u00f3n do_action( 'wp_head' )<\/code><\/strong> puede ser enganchada para ejecutar c\u00f3digo personalizado cada vez que WordPress procesa el encabezado del sitio<\/a>. Esta acci\u00f3n no tiene ning\u00fan otro argumento.<\/p>\n
Los filtros est\u00e1n definidos en el c\u00f3digo de WordPress como:<\/p>\n
apply_filters( 'filter_name', 'value_to_be_filtered', [optional_arguments] );<\/code><\/pre>\n
La cadena filter_name<\/code><\/strong> es el nombre del filtro, la variable value_to_be _filtered<\/code><\/strong> es el valor que debe ser filtrado y devuelto, y la variable [optional_arguments]<\/code><\/strong> puede pasar argumentos adicionales, al igual que con las acciones.<\/p>\n
Ejemplo:<\/strong> El filtro apply_filters( 'admin_footer_text' , string $text )<\/code><\/strong> puede ser enganchado para modificar el texto que se muestra en el pie de p\u00e1gina del admin. A partir de WordPress 5.4, su valor predeterminado mostrar\u00e1 la frase Thank you for creating with<\/code><\/em> WordPress<\/em><\/a>.<\/em> en el pie del \u00e1rea de administraci\u00f3n.<\/p>\n
Aprender\u00e1s a engancharte a las acciones y filtros m\u00e1s tarde con muchos ejemplos del n\u00facleo de WordPress.<\/p>\n
Una vez enganchado, puedes dirigir tu c\u00f3digo para hacer<\/strong> o personalizar<\/strong> algo en tu sitio. Por ejemplo, puedes utilizar ganchos para enviar un correo electr\u00f3nico autom\u00e1tico<\/a> despu\u00e9s de publicar un mensaje, o cargar hojas de estilo personalizadas<\/a> para cambiar la apariencia de tu sitio.<\/p>\n
\"Los
Los ganchos de WordPress te ayudan a interactuar o modificar tu sitio web<\/figcaption><\/figure>\n
La forma m\u00e1s simple de entender los ganchos es imaginar que tu sitio web de WordPress<\/a> est\u00e1 construyendo una casa.<\/p>\n
Los ganchos son similares a usar una gr\u00faa para mover objetos de construcci\u00f3n de un lado a otro. Los art\u00edculos que se transfieren son las funciones de callback<\/strong>\u00a0que incluyen tu c\u00f3digo personalizado<\/a>. Estos art\u00edculos (o funciones) pueden ayudarte a construir o modificar la casa.<\/p>\n
\"Ejemplo
Ejemplo de enganche en la acci\u00f3n \u00abwp_head\u00bb en WordPress<\/figcaption><\/figure>\n
Las funciones de callback pueden ser funciones regulares de PHP, funciones predeterminadas de WordPress o funciones personalizadas definidas por t\u00ed.<\/p>\n
S\u00f3lo podemos llevar ciertos art\u00edculos en portadores espec\u00edficos unidos a ganchos particulares. Por lo tanto, las acciones s\u00f3lo pueden ser enganchadas con las funciones de acci\u00f3n.<\/strong> Del mismo modo, los filtros s\u00f3lo pueden ser enganchados con Funciones de Filtro<\/strong>.<\/p>\n
Mientras que es tedioso cambiar los ganchos y los portadores en una gr\u00faa, WordPress lo hace s\u00faper f\u00e1cil al incluir m\u00e1s de 2.200 tipos de ganchos predeterminados<\/a>.<\/p>\n
\"WordPress
WordPress 5.1 tiene m\u00e1s de 2200 ganchos nativos (Fuente: Adam Brown)<\/figcaption><\/figure>\n
Puedes encontrar ganchos repartidos por el n\u00facleo de WordPress, lo que te permite acceder a la posici\u00f3n exacta en la que quieres engancharte y ejecutar tu c\u00f3digo personalizado.<\/p>\n\n
Ganchos vs Acciones vs Filtros<\/h2>\n
Seg\u00fan el manual de plugins de WordPress<\/a>:<\/p>\n
\u00abLos ganchos son una forma de que una pieza de c\u00f3digo interact\u00fae\/modifique otra pieza de c\u00f3digo… Hay dos tipos de ganchos: Acciones y Filtros.<\/em>\u201d<\/p><\/blockquote>\n
Hay una incoherencia generalizada en la forma en que se utilizan los t\u00e9rminos Gancho<\/strong>, Acci\u00f3n<\/strong> y Filtro<\/strong>. Algunos tutoriales y gu\u00edas los mezclan con las funciones asociadas a ellos. Una de las principales razones por las que existe esta confusi\u00f3n es por la compleja naturaleza del funcionamiento de los ganchos.<\/p>\n
Incluso si miras cuidadosamente dentro del n\u00facleo de WordPress, ver\u00e1s que no hay mucha diferencia entre a\u00f1adir acciones y filtros. Aqu\u00ed est\u00e1 el c\u00f3digo fuente de la funci\u00f3n add_action()<\/a> del archivo wp-includes\/plugin.php<\/code>:<\/strong><\/p>\n
function add_action( $tag, $function_to_add, $priority = 10, $accepted_args = 1 ) {\u00a0 \u00a0 \u00a0 \n    return add_filter( $tag, $function_to_add, $priority, $accepted_args );\n}<\/code><\/pre>\n
La funci\u00f3n add_action()<\/code><\/strong> s\u00f3lo llama a la funci\u00f3n add_filter()<\/code><\/strong> y devuelve su valor. \u00bfPor qu\u00e9? Porque ambas funcionan fundamentalmente de la misma manera, excepto por una diferencia.<\/p>\n
La funci\u00f3n apply_filters()<\/code><\/strong> devuelve un valor que puede cambiar los tipos de datos existentes, mientras que la funci\u00f3n do_action()<\/code> no devuelve<\/strong> nada (valor NULL en PHP<\/a>).<\/p>\n
Si todav\u00eda est\u00e1s confundido, no te preocupes. Una vez que termines la primera mitad de este art\u00edculo, todo estar\u00e1 claro. Nos ce\u00f1iremos a la terminolog\u00eda oficial del Codex de WordPress ya que es clara, precisa y universal.<\/p>\n
Por ahora, familiar\u00edzate con la rutina del gancho que se muestra a continuaci\u00f3n.<\/p>\n
\"La
La rutina del gancho: Ganchos, funciones de gancho y funciones de callback<\/figcaption><\/figure>\n
Vamos a desglosar las diferencias entre Acciones y Ganchos.<\/p>\n\n\n\n\n\n\n\n\n\n\n\n\n\n
Ganchos de WordPress<\/strong><\/td>\n<\/tr>\n
Acciones<\/strong><\/td>\nFiltros<\/strong><\/td>\n<\/tr>\n
Las acciones se utilizan para ejecutar funciones personalizadas en un punto espec\u00edfico durante la ejecuci\u00f3n de WordPress Core.<\/td>\nLos filtros se utilizan para modificar o personalizar los datos utilizados por otras funciones.<\/td>\n<\/tr>\n
Las acciones son definidas\/creadas por la funci\u00f3n do_action( 'action_name' )<\/code><\/strong> en el c\u00f3digo de WordPress.<\/td>\nLos filtros son definidos\/creados por la funci\u00f3n apply_filters( 'filter_name', 'valu_to_be_filtered' )<\/code><\/strong> en el c\u00f3digo de WordPress.<\/td>\n<\/tr>\n
Las acciones tambi\u00e9n se llaman ganchos de acci\u00f3n<\/strong>.<\/td>\nLos filtros tambi\u00e9n se llaman ganchos de filtro<\/strong>.<\/td>\n<\/tr>\n
Las acciones s\u00f3lo se pueden enganchar con las funciones de acci\u00f3n. Por ejemplo, add_action()<\/code><\/strong>, remove_action()<\/code><\/strong>.<\/td>\nLos filtros s\u00f3lo se pueden enganchar con las funciones de filtro. Por ejemplo, add_filter()<\/code><\/strong>, remove_filter()<\/code><\/strong>.<\/td>\n<\/tr>\n
Las funciones de acci\u00f3n no necesitan pasar ning\u00fan argumento a sus funciones de callback.<\/td>\nLas funciones de filtro necesitan pasar al menos un argumento a sus funciones de callback.<\/td>\n<\/tr>\n
Las funciones de acci\u00f3n pueden realizar cualquier tipo de tarea, incluyendo cambiar el comportamiento de c\u00f3mo funciona WordPress.<\/td>\nLas funciones de los filtros s\u00f3lo existen para modificar los datos que les pasan los filtros.<\/td>\n<\/tr>\n
Las funciones de acci\u00f3n no deber\u00edan return<\/code><\/strong> nada. Sin embargo, pueden hacer echo<\/code><\/strong> salida o interactuar con la base de datos.<\/td>\nLas funciones del filtro deben return<\/strong><\/code> devolver sus cambios como salida. Aunque una funci\u00f3n de filtro no cambie nada, debe return<\/strong><\/code> la entrada no modificada.<\/td>\n<\/tr>\n
Las acciones pueden ejecutar casi cualquier cosa, siempre que el c\u00f3digo sea v\u00e1lido.<\/td>\nLos filtros deben funcionar de manera aislada, para que no tengan efectos secundarios no deseados.<\/td>\n<\/tr>\n
Resumen:<\/strong> Una acci\u00f3n interrumpe el proceso regular de ejecuci\u00f3n del c\u00f3digo para hacer algo con la informaci\u00f3n que recibe, pero no devuelve nada, y luego sale.<\/td>\nResumen:<\/strong> Un filtro modifica la informaci\u00f3n que recibe, la devuelve a la funci\u00f3n de gancho de llamada, y otras funciones pueden usar el valor que devuelve.<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n
A veces, se puede utilizar una acci\u00f3n o un filtro para lograr el mismo objetivo. Por ejemplo, si quieres modificar el texto de un post, puedes registrar una funci\u00f3n de callback con la acci\u00f3n publish_post<\/a> y cambiar el contenido del post cuando se guarda en la base de datos<\/a>.<\/p>\n
\/\/ define the callback function to change the text\nfunction change_text_callback() { \n    \/\/ add the code to change text here\n}\n\n\/\/ hook in to the 'publish_post' action with the add_action() function\nadd_action( 'publish_post', 'change_text_callback' );<\/code><\/pre>\n
O puedes registrar otra funci\u00f3n de callback con e content_filter<\/a> para modificar el contenido del mensaje antes de que se muestre en el navegador.<\/p>\n
\/\/ define the callback function to modify the text\nfunction change_text_another_callback( $content ) { \n    \/\/ add the code to change text here and then return it \n    return $filtered_content;\n}\n\n\/\/ hook in to 'the_content' filter with the add_filter() function\nadd_filter( 'the_content', 'change_text_another_callback');<\/code><\/pre>\n
Dos enfoques diferentes con el mismo resultado. Saber cu\u00e1ndo usar uno sobre el otro es la clave para ser un buen desarrollador de WordPress<\/a>.<\/p>\n
\u00bfC\u00f3mo funcionan los ganchos de WordPress?<\/h2>\n
El ejemplo de la casa era lo suficientemente simple como para entender el funcionamiento b\u00e1sico de los ganchos, pero no capta la complejidad de su funcionamiento. Lo m\u00e1s importante son los conceptos de posici\u00f3n y especificidad del gancho.<\/p>\n
Un mejor ejemplo ser\u00eda imaginar el procesamiento de una p\u00e1gina web de WordPress como el montaje de un coche. A diferencia de la fabricaci\u00f3n de un coche, que lleva tiempo, el montaje de una p\u00e1gina web es casi instant\u00e1neo.<\/p>\n
\"Montar
Montar una p\u00e1gina web es como montar un coche<\/figcaption><\/figure>\n
Al igual que un coche se ensambla pieza por pieza en una l\u00ednea de montaje moderna, una p\u00e1gina web de WordPress se ensambla elemento por elemento por el servidor y el cliente.<\/p>\n
El n\u00facleo de WordPress es como el motor del coche, el chasis y otros elementos esenciales, que potencian la funcionalidad del \u00abn\u00facleo\u00bb del sitio web.<\/p>\n
Puedes tener un sitio web funcional s\u00f3lo con el n\u00facleo de WordPress, pero \u00bfd\u00f3nde est\u00e1 la diversi\u00f3n en eso? Necesitas agregar caracter\u00edsticas emocionantes al sitio. Ah\u00ed es donde intervienen los plugins<\/a> y temas<\/a> de WordPress<\/a>, los cuales usan ganchos extensamente.<\/p>\n
En el ejemplo anterior, cada estaci\u00f3n numerada es como un gancho dentro del n\u00facleo de WordPress. Hay dos tipos de estaciones, como acciones y filtros. Cada estaci\u00f3n incluye un tipo espec\u00edfico de ranura que s\u00f3lo acepta ciertas herramientas, como las funciones de acci\u00f3n y las funciones de filtro.<\/p>\n
Todas las estaciones se colocan a intervalos frecuentes para mayor modularidad y eficiencia.<\/p>\n
Dependiendo de los requisitos de un puesto concreto, podemos acoplar (o enganchar) la herramienta m\u00e1s apropiada para el trabajo en esa estaci\u00f3n concreta. Estas herramientas son como las funciones de callback que se utilizan para interactuar o modificar WordPress.<\/p>\n
Algunas herramientas pueden alterar significativamente el funcionamiento del coche, como las llamadas registradas a las acciones. Otras herramientas s\u00f3lo se utilizan para personalizar el aspecto del coche, como las llamadas registradas a los filtros.<\/p>\n
Usar las herramientas correctas en las estaciones correctas es crucial para construir un coche de primera clase. De la misma manera, los ganchos nos ayudan a personalizar WordPress seg\u00fan nuestras necesidades \u00fanicas.<\/p>\n
Si extiendes esta analog\u00eda, los plugins son como a\u00f1adir \u00fatiles funciones de autom\u00f3vil como airbags, consola de entretenimiento, sistema remoto sin llaves, etc. (como estos para mejorar la funcionalidad de WooCommerce<\/a>). Los temas son an\u00e1logos a la personalizaci\u00f3n de la parte visual del coche, como el dise\u00f1o general, la pintura, las llantas, etc. (aqu\u00ed est\u00e1 c\u00f3mo personalizar el tema<\/a> de WordPress<\/a>).<\/p>\n
\u00bfD\u00f3nde registrar los ganchos y sus funciones?<\/h2>\n
Hay dos formas recomendadas de a\u00f1adir ganchos en WordPress:<\/p>\n