Darío Ferrer - Blog

Mi primer intento de extraer imágenes en Wordpress para mostrarlas en cualquier parte se ha quedado corto con un proyecto que asumí recientemente (te recomiendo que leas ese artículo antes de continuar). Básicamente se mejoraron algunos aspectos importantes:

• Ahora se pueden publicar un montón de imágenes en una entrada y escoger libremente la que aparecerá en la lista de artículos (por ejemplo el index.php).
• Ya se puede elegir una imagen “por defecto” o “genérica” en caso de que el artículo no tenga fotos.
• Se puede optar por agregarle a la imagen un enlace al artículo o dejarla sin enlazar.
• Agregados atributos “alt” y “title” a la imagen.
• Finalmente cambié el coñazo de condicionales antiguas por la función switch, un procedimiento más elegante y semántico.

Primero vamos a publicar el código completo para los más vagos. Luego viene la explicación del mismo y finalmente las intrucciones de cómo configurarlo a gusto:

Como puedes notar, la función mi_imagen() es bastante simple y consta de tres bloques: 1) La definición de variables, 2) las funciones que operarán en caso de que tengas imágenes en tu artículo y 3) las que operarán en caso de que no las tengas. Finalmente le damos salida al resultado.

Configuración

1.- Imagen genérica

En la variable $ubicación colocarás la URL de tu imagen genérica. Ésta aparecerá en caso de que no hayas configurado una imagen para tu entrada:

2.- Cómo aplicar la función

Debes colocar la etiqueta en el sitio adecuado, por ejemplo:

La anterior estructura le daría un aspecto a los artículos similar a los del índice de este sitio: Título, imagen y texto introductorio (tal como el index de este mismo blog). Por supuesto debes jugar con los estilos para lograr la apariencia deseada. También puedes encerrar los elementos entre etiquetas HTML para ampliar las opciones de personalización. A tu criterio.

Tengo varias imágenes en mi artículo ¿Cómo elijo la adecuada?

Simple. Sólo ingresa a tu Editor de textos > Agregar imágenes > Galería. Todo lo que debes hacer es colocar la imagen que deseas en primer lugar, así:

En otras palabras, la imagen que se encuentre en primer lugar es la que aparecerá junto a tu entrada en la presentación, aunque dentro del artículo conserve el orden que le diste al principio.

¿Cómo cambio los valores de imagen, tales como tamaño y enlaces?

Cuando colocas esta etiqueta…

… los valores predeterminados son: 1) Tamaño miniatura y 2) Con enlace al artículo.

Si deseas otro tamaño deberás escribir (ejemplo con tamaño medio):

Los valores para esta variable son ‘medio’, ‘grande’ y ‘full’. El tamaño miniatura (thumbnail) viene de forma predeterminada (si prefieres miniatura no configures el tamaño) Puedes ajustar las configuraciones de medidas de imágenes en tu Panel de control > Opciones > Objetos:

Para desactivar el enlace a la imagen simplemente escribe:

Desactivando enlace y personalizando el tamaño:

Ideas para aplicar

Sólo imagina las posibilidades que puedes lograr con esta función. Supongamos que tu maquetación incluye un artículo principal (foto grande), dos artículos secundarios (foto mediana) y una lista de artículos anteriores (miniatura). Si implementas la función explicada lograrás que tus artículos roten y sus respectivas imágenes adoptarán el tamaño que configuraste en cada loop.

Revisiones

Rev. 3 – 02/06/2009 16:34: El compañero Lucas me ha advertido acerca de la carencia de atributos “alt” y “title” en el HTML resultante, por lo cual agregué dicha función. El mismo me sugería el uso de get_image_tag, pero aún le sigo apostando a wp_get_attachment_image ya que mantiene simple el asunto de los tamaños, así que le apliqué un reemplazo simple. Acualmente estoy estudiando sustituir la función por wp_get_attachment_image_src pero eso será después. Tengo sueño. Regresaré al ataúd.