Enralados

Imágenes en WordPress, lo básico

Muchos sabemos como poner imágenes en nuestros Posts de WordPress pero por comodidad o desconocimiento no aprovechamos todas las posibilidades que nos ofrece a la hora de subir una imagen al servidor.

Para insertar una imagen en un post, después de haberla seleccionado, en la ventana o cuadro de diálogo que se abre hay varias opciones.

- En el campo Title poner lo que se quiera que aparezca cuando se pone el ratón encima de la imagen.
- Alternate Text es igual que el anterior, se usan para sustituir la imagen por texto en los navegadores de algunas personas con discapacidad visual. De ahí la importancia de poner un texto lo más descriptivo y que guarde relación con la imagen. También es usado por los motores de búsqueda al considerarlos palabras claves.
- El campo Caption es para subtitular y poner un marco alrededor de la imagen en los themes que estén preparados para ello, en caso de duda dejar en blanco.
- El campo Description es para poner un comentario a la imagen, no sale en el post. No es necesario rellenarlo.
- Para poner un link de la imagen seleccionar el botón que pone File URL. WordPress se encargará de poner el código correspondiente. Esto significa que al pulsar sobre la imagen en el Post se abrirá otra ventana en el navegador conteniendo sólo la imagen en su tamaño original.

Hay themes que tienen su propia gestión de las imágenes y suelen incluir un archivo llamado image.php para que no salgan en otra ventana sino que se muestre como si fuese otro Post. También existen plugins como por ejemplo lightbox que permiten con un bonito efecto mostrar la imagen sin cambiar de ventana.

Si no se quiere Link y sólo se quiere insertar la imagen en el post pulsar el botón None, si se tiene lightbox no actuará.

Alignment,
- None si no quieres ninguna alineación o tu theme tiene su propia alineación
- Left, alinea la imagen a la izquierda (el texto se situa a la derecha de la imagen)
- Center, coloca la imagen en el centro (sin textos a los lados)
- Right, alinea a la derecha (texto a la izquierda).

Según lo anterior WordPress añade al código las clases CSS alignnone, alignleft, aligncenter y alignright. Normalmente todos los nuevos themes están preparados para responder a estas alineaciones aunque puede haber alguno que no lo esté, sobre todo los antiguos. En ese caso se pueden añadir a la hoja de estilos style.css sin grandes complicaciones.

Size
- Thumbnail, imagen pequeña
- Medium, imagen de mediano tamaño
- Large, imagen de gran tamaño
- Full size, la imagen al tamaño real

Para elegir una u otra hay que tener en cuenta el tamaño real que se sube. No se puede poner una imagen de 1024 x 768 pixeles si la que subes es de 200 x 200 por ejemplo.

Una vez preparado lo anterior pulsar el botón Insert into Post. Esto crea los códigos necesarios con el enlace al archivo de imagen que acabas de subir. Recordar primero poner el cursor en el lugar del texto elegido para poner la imagen en la ventana de edición del Post. Para ver los códigos es necesario estar en el modo HTML del editor de Post.

El botón Save All Changes es para guardar la última elección.

Las dimensiones que aparecen en Size se configuran en el Menú Settings - Media.

Puedes poner las dimensiones que quieras, aunque no es conveniente muy grandes porque ralentiza la carga del blog y aumenta el tamaño de las carpetas innecesariamente. Ademas hay que tener en cuenta el espacio dentro del Post, normalmente no supera los 500 pixeles de ancho y a veces menos, eso depende del theme.

- Thumbnail size se refiere a los Thumbnails (miniaturas), 150 x 150 suele estar bien. Si marcas donde pone "Crop thumbnail to exact dimensions" (Recortar las miniaturas a las dimensiones exactas) las imágenes salen con lados iguales. Si la imagen no es cuadrada se recorta el lado mayor que supere los 150 pixeles para que quepa en la medida. Si no marcas donde pone "Crop thumbnail to exact dimensions". La imagen se reduce y guarda la misma proporción que la original. En el caso de que no sea cuadrada el lado mayor se pone a 150 pixeles y el menor se reduce guardando las proporciones originales.

Esto último se aplica al resto de tamaños.

- Medium size, la medida que quieres para las imágenes de tamaño medio.
- Large size, la medida para las imágenes grandes.

Esto se hace para que todas las imágenes que se suban al servidor y aparezcan en el blog tengan las mismas dimensiones. Configura tus propios tamaños y elige según desees.

Un detalle a tener en cuenta, si subes imágenes muy grandes WordPress crea todos los tamaños intermedios automáticamente. Es decir, si subes una imagen mayor que la especificada en Large en la carpeta correspondiente obtendrás copias de tres imágenes dimensionadas para los tamaños Thumbnails, Medium, Large más la imagen a tamaño original. Esto aumentará el tamaño de las carpetas de imágenes del blog.

Si sabes la medida de las imágenes que quieres en el Post súbelas ya con ese tamaño y después eliges la opción Full size, así ahorrarás espacio en el servidor y no te hará falta establecer tamaños intermedios.

En las últimas versiones de WordPress existe una nueva opción, Embeds. Si marcas la casilla Auto-Embeds (auto-embebidos o auto-incrustados) el contenido de ciertas URLs será incrustado en los Posts sin necesidad de códigos ni plugins. Es el caso de los videos de YouTube, sólo teclea la URL del video y WordPress hará el resto. Por supuesto no se puede incrustar todo tipo de URLs por razones de seguridad. Consulta en codex.wordpress.org las URLs soportadas.

En Maximum embed Size (tamaño máximo incrustado) pones las medidas máximas que debe tener el código embebido.