Seleccionar página

Si utilizáis la opción de “Asignar imagen destacada” en WordPress, os habréis dado cuenta de que no suelen mostrar los atributos title, alt y description. A veces uno, a veces otro, a veces dos, pero rara vez todos. Y a veces, por motivos de SEO principalmente, queremos tenerlos todos.

La solución más sencilla pasa por programar una función que recoja todo y lo una en la etiqueta <img> del código. Esta función, como de costumbre, la podemos programar en un plugin nuevo, o en en el archivo functions.php de nuestro Theme.

¿En qué consiste la función?

Hemos de tener en cuenta que podemos obtener los datos de un archivo multimedia con la función “get_post“. Sí, WordPress trata a los archivos multimedia como otro tipo de entrada, así que podemos aprovechar esto en nuestro beneficio.

Lo primero que haremos será obtener el objeto con todos los datos, a partir de la ID del Thumbnail asignado (que obtenemos a partir de la ID del post). Luego simplemente imprimimos con echo.

Aquí tenemos la función:

Voy a explicarlo un poco mejor.

Vemos que la función tiene 3 parámetros de entrada:

  • $id: Id de la entrada de la cual queremos obtener el Thumbnail.
  • $class: Atributo clase que llevará <img> (mirad en la última línea dónde se situa). Es un parámetro opcional, con valor por defecto vacío.
  • $size: Cuando recuperamos con WordPress una imagen, podemos establecer en qué tamaño. Aunque admite un array con los valores ancho y alto, esto se refiere más a los tamaños predefinidos de WordPress para las imágenes. Como ya sabréis, y si no os lo explico ahora, al subir una imagen a WordPress se crean copias redimensionadas a los tamaños predefinidos del sistema. Esos tamaños (que podemos definir nosotros incluso desde functions.php o un plugin propio) tienen una id única, y con este parámetro estamos especificando cual de esos tamaños queremos. Es otro parámetro opcional, cuyo valor por defecto es “post-thumbnail”, uno de los tamaños por defecto del sistema.

 

Las primeras líneas guardan la id de la miniatura en la variable $thumb_id con get_post_thumbnail_id, ya que luego la necesitaremos más veces.

Como ya os decía, podíamos usar casi directamente el contenido de get_post para imprimir los datos, pero nos habría quedado un chorizo importante dentro del echo. Asignando todo a variables se obtiene un código más claro y legible.

get_post devuelve un array que contiene ya title y description. Para el atributo alt necesito obtener el campo meta ‘_wp_attachment_image_alt‘, usando la id de la miniatura ($thumb_id). La url la obtenemos mediante wp_get_attacment_img_src (aquí es donde usamos $size para especificar el tamaño), pero esto me devuelve un array del cual sólo necesito el primer campo.

Finalmente, con echo, imprimimos la imagen en HTML, añadiendo también la class, por si en algún momento necesitamos establecer una clase CSS a la <img>.

Y listo. Ahora sólo hay que llamar a esta función en nuestro tema cuando queramos imprimir la imagen destacada con todos los datos. ¡Pero no te olvides de rellenar dichos datos al subir una imagen! Que si no, seguro que no salen…

“Primero resuelve el problema. Entonces, escribe el código”
.- John Johnson