¿Qué son los filtros y cómo usar add_filter en WordPress? 

Un filtro de WordPress es un hook que manipula datos internos antes de que se muestren en el navegador. Para crear un filtro, añade la función add_filter en el archivo functions.php de tu sitio web.

En el desarrollo de WordPress, los usuarios utilizan este filtro para modificar un plugin, un tema o una funcionalidad específica del sitio web. Por ejemplo, puedes cambiar la longitud del extracto de las entradas de tu sitio web o añadir una nota de pie de página a los artículos.

En este tutorial de WordPress, explicaremos cómo usar la función add_filter para crear un hook de filtro. También exploraremos los parámetros de la función y proporcionaremos ejemplos de casos de uso comunes.

Un filtro de WordPress es un hook que modifica los datos antes de que sean devueltos a la base de datos y mostrados a los usuarios. Como resultado, puedes personalizar plugins, temas o la funcionalidad de sitios web sin alterar los archivos del núcleo de WordPress.

Por ejemplo, añadir un pie de página a todas las entradas del sitio web o cambiar la longitud de su extracto. Existen cuatro funciones de hook de filtro comunes: add_filter, remove_filter, has_filter y doing_filter.

Cómo funcionan los filtros de WordPress

Los filtros interceptan los datos que pasa WordPress. Los modifican basándose en la función dada y los muestran a los navegadores web de los usuarios. Para ayudarte a entender, mira este fragmento:

// Specify the filter and the callback function
   add_filter( 'example_filter', 'example_callback' );
   // Define the callback function
   function example_callback( $example ) {
      // alter $example by concatenating on it
      $example . ‘ add a text at the end ’;
      return $example;
   }

He aquí la explicación del ejemplo:

  1. Establece un filtro utilizando la función add_filter que modificará los datos. En nuestro caso, el nombre del filtro es example_filter.
  2. Define la función callback que se ejecutará cuando WordPress encuentre el filtro, concretamente example_callback.
  3. Especifica cómo la función callback modificará los datos, que el argumento $ejemplo representa. En el fragmento, utilizaremos el punto final para concatenar con una frase al final.
  4. Muestra los datos modificados al navegador web del usuario utilizando el método return.

Para aplicar un hook de filtro a tu sitio web WordPress, escribe el código en el archivo functions.php de tu tema activo. Si utilizas el servicio de alojamiento WordPress de Hostinger, abre el Administrador de archivos y ve a la carpeta public_html/wp-content/themes/yourthemefolder.

Archivo Functions.php del Administrador de archivos

Además, te recomendamos que añadas el código al archivo de tu tema hijo para evitar que desaparezca tras una actualización. Como alternativa, crea un archivo independiente para los hooks de filtro en la carpeta raíz del tema y escribe el siguiente código en el archivo functions.php para activarlo:

include _once( get_template_directory(), ‘/yourfilename.php’:’

Si no puedes acceder a la carpeta raíz del tema, instala un plugin para añadir el código personalizado directamente desde el panel de administración de WordPress. Un plugin popular para esta tarea es Code Snippets.

¡Importante! Modificar el archivo functions.php puede provocar un error o un sitio web inaccesible. Para evitarlo, crea una copia de seguridad antes de proceder.

Parámetros de add_filter de WordPress

La función add_filter de WordPress tiene cuatro parámetros. Aquí está cada uno de ellos:

  • Nombre del hook: El nombre del filtro al que quieres enganchar las funciones callback.
  • Función callback: La función callback que se ejecutará cuando se aplique el filtro.
  • Prioridad: Parámetro opcional que especifica el orden de ejecución de las funciones asociadas a un filtro. El valor por defecto es 10, y cuanto menor sea el número, antes se ejecutará.
  • Argumentos aceptados: El número de argumentos pasados a las funciones enganchadas. Este parámetro es opcional y tiene el valor predeterminado de 1.

La sintaxis de la función y los parámetros es la siguiente:

add_filter( hook_name, callback_function, priority=1, 
   accepted_arguments=1);

Ejemplos de add_filter en WordPress

Los filtros de WordPress permiten a los usuarios cambiar o añadir nuevas funciones a sus sitios web. Para tu referencia, esta sección explorará algunos fragmentos de código de ejemplo.

Cambiar la longitud del extracto de un post

Un ejemplo sencillo de uso de un filtro de WordPress es cambiar la longitud del extracto de las entradas por defecto. Aquí está el fragmento de código:

add_filter( ‘excerpt_length’, ‘change_length’ );
   function change_length( $length )
   {
      // change the default excerpt length
      return 20;
   }

En el fragmento, creamos una función que cambia la longitud del extracto de la entrada, que representa el argumento $length. Luego, enganchamos la función al filtro excerpt_length.

Cuando los datos pasen por el filtro, la función se ejecutará y los modificará en consecuencia. A continuación, el método return limitará la longitud del extracto a 20 y se lo pasará al usuario.

Ejemplo de uso de un filtro de WordPress

¡Importante! Para algunos temas de WordPress, también debes editar el archivo content.php para aplicar el filtro excerpt. Lee nuestro tutorial sobre cómo cambiar la longitud del extracto de WordPress para obtener más información al respecto.

Modificar el contenido de las entradas

Un uso común de la función add_filter es añadir nuevo contenido a las entradas de tu sitio web. Por ejemplo, aquí hay un fragmento de código de ejemplo que coloca un descargo de responsabilidad en la parte inferior de cada entrada del sitio web:

 add_filter( ‘the_content’, ‘add_disclaimer’ );
   function add_disclaimer( $content )
   {
      // concatenate the content to modify it
      return $content . 
      “<br><center><strong>Todos los escritos y opiniones son míos“;
   }

El ejemplo tiene el filtro the_content, que se conecta a la función callback add_disclaimer. Cuando se ejecute el filtro, esta función modificará $content concatenándolo con el mensaje Todos los escritos y opiniones son propios.

El código devolverá a los navegadores el contenido modificado con la cláusula de exención de responsabilidad al final.

Ejemplo de uso común de add_filter

Mostrar imagen a una categoría específica

Los hooks de filtro de WordPress permiten personalizar entradas con un ID o categoría específicos. En el siguiente fragmento, hemos añadido un icono a cada entrada que pertenece a la categoría premium:

add_filter( 'the_content', 'content_filter' );
   function content_filter( $content ) 
   {
      // condition where the function applies
      if ( in_category('premium') )
      $content = sprintf(
         '<img class="premium-icon"    
         src="%s/directory/filename.png"alt="Premium Content Icon"  
         title="" />%s', get_bloginfo( 'stylesheet_directory' ), 
         $content);
      return $content;
   }

En el ejemplo, creamos el filtro the_content y lo enganchamos con la función callback wpb_content_filter. La función especifica la condición en la que se aplicará el filtro.

En este caso, si el post pertenece a la categoría premium, la función de filtro alterará el contenido añadiéndole una imagen.

Ejemplo de Mostrar imagen a una categoría específica en WP

Cambiar el número de productos mostrados

Un filtro también te permite modificar un plugin de eCommerce para personalizar tu tienda online. Por ejemplo, aquí tienes un código personalizado que cambia el número de productos mostrados en el plugin WooCommerce:

add_filter('storefront_products_per_page','alter_sf_products_per_page' );
   function alter_sf_products_per_page() 
   {
      // change the default value
      return 3 ;
   }

En el fragmento, creamos el filtro personalizado storefront_products_per_page y lo enganchamos con la función alter_sf_products_per_page. Cuando los datos pasen por él, el filtro llamará a la función para cambiar el valor predeterminado de 12 a 3 y mostrarlo en los navegadores de los usuarios.

Filtro de número de productos mostrados en WP

Otros filtros comunes de WordPress

Además de add_filter, existen otras funciones que los desarrolladores pueden utilizar con el filtro hook.

remove_filter()

Esta función elimina una función enganchada a un filtro específico. Los desarrolladores web suelen utilizarla para eliminar la función predeterminada de WordPress sin eliminar el código por completo. Esta es la sintaxis:

remove_filter( hook_name, callback_function, priority = 10 );

doing_filter()

Esta función comprueba si se está ejecutando otra función. Toma un nombre de hook como parámetro y devuelve un valor verdadero o falso. La sintaxis es la siguiente:

if doing_filter( 'hook_name’ )
{ 
// execute a script if the filter is running 
};

has_filter()

La función has_filter verifica si se ha aplicado correctamente un filtro a un hook. Toma un nombre de filtro como primer parámetro y la función callback como segundo parámetro opcional.

Para comprobar una función específica, debes incluir el segundo parámetro. En caso contrario, devolverá true para indicar que cualquier función está enganchada al filtro. La sintaxis de la función es la siguiente:

has_filter( ‘hook_name’, ‘callback_function’ );

Conclusión

Un filtro es un hook de WordPress para modificar datos antes de mostrarlos en el sitio web. Los desarrolladores web lo utilizan para personalizar un plugin o un tema y añadir funcionalidades extra a sus sitios web.

El hook de filtro interceptará los datos que WordPress pase, los alterará en función de tus necesidades y los mostrará a los navegadores de los visitantes. Para establecer un filtro, escribe la función add_filter con el nombre del hook y la función callback como parámetros en el archivo functions.php de tu tema.

Los ejemplos de uso del filtro incluyen cambiar la longitud del extracto de un artículo y añadir un descargo de responsabilidad a las entradas de un sitio web. Además de add_filter, sus otras funciones son remove_filter, doing_filter y has_filter.

Si tienes alguna pregunta o comentario, no dudes en dejarlo a continuación.

Author
El autor

Diana Catalina Herrera Infante

Diana es una traductora con amplia experiencia en diferentes tipos de documentos, entre ellos tutoriales y artículos especializados en la creación de sitios web. Además, cuenta con experiencia en el área de marketing digital. En su tiempo libre le gusta hacer ejercicio y ver una buena película.