Incluir fotos y archivos multimedia en tus publicaciones es una excelente manera de enriquecer el contenido y hacerlo más atractivo para tus usuarios.
Lo bueno que tiene WordPress es que agregar imágenes, vídeos, audios o archivos en PDF es la mar de sencillo. Todo lo que subas se queda almacenado en la Biblioteca multimedia y, desde ahí, tú eliges si insertarlos en páginas o en artículos.
Incluso puedes crear enlaces para que tus visitas se puedan descargar los documentos.
¿Nunca lo has probado porque crees que es complejo y te vas a perder durante el proceso?
Entonces, sigue leyendo, porque en este post vamos a repasar paso a paso cómo agregar imágenes y casi todo tipo de archivos.
Venga, nos dejamos de cháchara y empezamos.
Cómo insertar imágenes en WordPress
El administrador de archivos de WordPress es extremadamente simple, por lo que agregar, alinear y enlazar fotografías individuales y galerías de imágenes es muy sencillo.
Para insertar una imagen en una página o en una entrada, solo tienes que hacer clic en el botón Añadir objeto y arrastrar tus imágenes desde cualquier carpeta en tu equipo hasta la ventana del navegador. Los archivos se subirán automáticamente.
Como alternativa, puedes hacer clic en el botón Selecciona archivos y luego seleccionar los archivos que quieras subir, usando el cuadro de diálogo que aparece.
Como tercera opción, arrastra la imagen directamente al Editor visual, sin necesidad de hacer clic en el botón Añadir objeto.
Una vez que hayas subido las imágenes por cualquiera de las 3 maneras, se mostrará la Biblioteca multimedia, que contiene todas las fotos que se hayan añadido previamente.
La imagen o las imágenes que acabas de subir se seleccionarán de forma automática para facilitarte la labor de incluirla en la página o entrada.
Las identificarás muy rápido porque se muestran con un icono de marca de verificación de color azul en la esquina superior derecha de la imagen.
Seleccionar, deseleccionar y modificar parámetros de las imágenes
Si has añadido una nueva imagen, pero quieres seleccionar otras que ya tengas en la biblioteca, presiona la tecla Ctrl (Cmd en Mac) y haz clic sobre las que quieras elegir.
Para deseleccionar una imagen, haz clic en la marca de verificación que aparece en la esquina superior derecha de la imagen.
Mientras estés seleccionando fotos, en la parte inferior de la ventana verás un contador del número de imágenes que tienes seleccionadas.
Dentro de esta ventana Insertar objeto, existen varias opciones, que te ayudarán a simplificar el proceso de inserción de imágenes.
Por defecto, se muestran todas las imágenes previamente subidas y primero aparecen las más recientes. Para no volverte loco buscando una foto, en la parte superior de la ventana hay un menú desplegable que te permite filtrar con las siguientes opciones: Todos los elementos multimedia, Subido a esta entrada/página, o Imágenes, Audio, Vídeo y Sin adjuntar.
También puedes filtrar tus archivos multimedia seleccionando una fecha o a través del campo Buscar.
Las propiedades de la imagen resaltada (es decir, la imagen con el borde azul) se mostrarán en la parte derecha de la ventana Insertar objeto.
Estas propiedades incluyen el nombre del archivo, la fecha en que fue subido y el tamaño de la imagen. Aquí también puedes cambiar el título, la leyenda, el texto alternativo y la descripción para cada imagen, así como la alineación, el enlace y el tamaño.
Veamos en detalle qué es cada una de estas opciones.
- Título: aparece como una descripción emergente al posar el puntero del ratón sobre la imagen en el navegador.
- Leyenda: se muestra debajo de la imagen como un breve epígrafe. También puedes incluir HTML básico en las leyendas
- Texto alternativo: es la información visible cuando el navegador no puede leer la imagen y la que consultan los usuarios con discapacidades visuales, por lo cual es importante añadir una palabra o frase que describa bien la imagen. En menor grado, también cumple una función de cara al SEO.
- Descripción: por lo general, aparece en la página que contiene la imagen adjunta. Sin embargo, esto depende enteramente del tema que uses en tu web.
Además, para cada imagen, puedes personalizar varios parámetros.
- Alineación: selecciona la alineación (izquierda, centrada, derecha o ninguna) a través del desplegable Alineación. Si eliges como opción “ninguno”, la foto se publicará con la alineación por defecto configurada en tu plantilla.
- Dirección de enlace: si quieres incluir un enlace en la foto, WordPress ofrece varias opciones. Puedes cambiar la dirección a la que enlazará la imagen utilizando la lista desplegable Enlazado a, enlazar a la página que contiene la imagen adjunta seleccionando Página de adjuntos, enlazar a la imagen en tamaño completo seleccionando Archivo multimedia o enlazar a cualquier URL a través de URL personalizada (aquí, aparecerá un nuevo campo para que escribas la dirección personalizada). Si no quieres enlazar a ninguna dirección, con elegir Ninguno es suficiente.
- Tamaño: cuando subes una imagen, WordPress crea varias copias del archivo en distintos tamaños. Puedes elegir cuál de esos tamaños insertar a través de la lista Tamaño. Para insertar la imagen en el tamaño exacto en que fue subida, simplemente selecciona Tamaño completo. A continuación de cada tamaño, verás las dimensiones actuales de la imagen en píxeles (por ejemplo, 300 x 225).
Insertar, cambiar orden y editar las imágenes
Una vez que has seleccionado todas las imágenes, haz clic en el botón Insertar en la entrada para añadir la imagen en tu página o post.
Si quieres cambiar el orden de las imágenes, haz clic en el enlace Editar selección de la parte inferior de la ventana Insertar multimedia. La ventana cambiará de tal manera que solo se mostrarán las imágenes seleccionadas.
Como alternativa, si pinchas en el enlace Borrar deseleccionarás todas las imágenes.
Puede cambiar el orden de las imágenes solo tienes que cliquear sobre cada una y arrastrarla para reubicarla.
Desde ahí, también puedes actualizar el título, la leyenda, el texto alternativo y la descripción de cada imagen. Para eliminar una de las imágenes seleccionadas, haz clic en la marca de verificación (que se transformará en una rayita horizontal al posar el puntero del ratón) que aparece en la esquina superior derecha de la imagen.
Al hacer clic en el botón Volver a la biblioteca, regresarás a la pantalla anterior, que te permite seleccionar o deseleccionar las imágenes.
Cuando estás editando entradas o páginas, si deseas insertar una imagen que has subido anteriormente (a diferencia de subir una nueva imagen), haz clic otra vez en el enlace Añadir objeto.
En la ventana emergente, pincha en la pestaña Biblioteca multimedia en la parte superior de la ventana, en lugar de subir una nueva imagen. Se mostrarán todas las imágenes subidas previamente, de la más reciente hasta la más antigua.
Selecciona la imagen o las imágenes que quieras y luego cliquea en el botón Insertar en la entrada (si estás editando una página, el botón dirá Insertar en la página).
Además, puedes hacer clic en el botón Editar selección de la parte inferior de la ventana para cambiar el orden en que se incluirán las imágenes.
Editar y borrar una imagen
¿Quieres ajustar alguna imagen?
Pincha sobre la foto en cuestión y, además de los controles de redimensionamiento (cuadraditos que te permiten cambiar el tamaño), verás una pequeña barra de herramientas encima de la imagen.
Desde ahí, puedes modificar la alineación, editar las propiedades (en el icono del lápiz) o borrarla (por cierto, solo la borras de la publicación en la que estés trabajando, no de la biblioteca).
Si haces clic en el botón Editar, aparecerá la ventana emergente Detalles de la imagen, desde donde cambias las propiedades de la imagen y del enlace.
Aparte de las opciones básicas que vimos antes, tienes la posibilidad de personalizar otras avanzadas.
- Tamaño: selecciona un tamaño específico de la lista desplegable o elige Tamaño personalizado para especificar el ancho y la altura (en píxeles).
- Atributo “title” de la imagen: estos metadatos se muestran en forma de descripción emergente al posar el puntero del ratón sobre la imagen en el navegador.
- Clases CSS de la imagen: por defecto, WordPress asignará varias clases CSS a la imagen. Si quieres añadir algunas adicionales, puedes hacerlo desde este campo.
- Relación del enlace: describe la relación del documento actual con el enlace específico.
- Clases CSS del enlace: si hay alguna clase CSS específica que necesitas configurar en el enlace HTML, puedes agregarla aquí.
Al hacer clic en el botón Editar original (en la derecha) podrás hacer cambios sencillos en la imagen: rotar, voltear, modificar la escala y recortarla.
Si quieres reemplazar la imagen por otra, haz clic en el botón Reemplazar. Aterrizarás en la Biblioteca multimedia, de donde podrás seleccionar una imagen nueva.
Una vez actualizadas las propiedades de imagen, pincha sobre Actualizar para guardar los cambios o bien sobre la pequeña ‘x’ de la esquina superior derecha de la ventana emergente, para cerrarla sin guardar ningún cambio.
Configurar una imagen destacada
Muchos temas permiten especificar imágenes destacadas.
Una imagen destacada (que también se llama miniatura de entrada o de página) es una foto que ilustra o se relaciona con el contenido de la publicación. La manera en que se muestran estas imágenes en el sitio depende de la plantilla que uses.
¿Cómo puedes saber si tu tema incluye esta opción?
Si está disponible, verás un panel específico a la derecha. Y si no la incluye, no aparecerá.
Pasos para configurar una imagen destacada
Pincha en el enlace Asignar imagen destacada. Se abrirá una ventana igual a la que se muestra cuando se añade una imagen a las páginas y en las entradas.
Puedes subir una nueva imagen para usar como imagen destacada o seleccionarla de las que tienes en la Biblioteca multimedia.
Para subir una imagen nueva, solo tienes que hacer clic en el enlace Subir archivos de la parte superior de la ventana emergente y pinchar sobre la imagen que quieras usar.
Ya sabes que puedes modificar el título, la leyenda, el texto alternativo y la descripción. Para seleccionar la imagen como imagen destacada, haga clic en el botón Asignar imagen destacada.
Automáticamente la verás en el panel Imagen destacada.
Insertar una galería de imágenes
WordPress tiene su propia galería de imágenes integrada, así que puedes agregar múltiples imágenes dentro de una página.
Para insertar una galería de imágenes, haz clic en el botón Añadir objeto y aparecerá una ventana emergente, desde donde puedes subir una foto nueva o elegir alguna de las que ya tengas.
Haz clic en el enlace Crear galería de la parte izquierda y luego selecciona las imágenes que quieras insertar en la galería.
Cuando termines de seleccionar las imágenes, pincha sobre el botón Crear una nueva galería de la parte inferior de la ventana emergente. Solo se mostrarán las imágenes seleccionadas.
Todas las imágenes que veas se usarán en tu galería. Para reordenarlas, simplemente cliquea en una imagen y arrástrala hacia una nueva posición.
Para agregar leyendas a las imágenes, pincha en el texto Titula esta imagen que aparece debajo de cada imagen y escribe lo que quieras o modifica el título, la leyenda, el texto alternativo y la descripción en la parte derecha de la ventana emergente. Recuerda que también puedes incluir código HTML básico en las leyendas, como por ejemplo hipervínculos.
Si quieres quitar una imagen de la galería, haz clic en el signo ‘-’ que aparece en la esquina superior derecha de la imagen al posar el puntero del ratón sobre la ‘x’.
Opciones de configuración de la galería de imágenes de WordPress
Como la galería integrada es muy simple, no hay demasiadas opciones para elegir. No obstante, vamos a repasar cada una de ellas.
- Enlazado a: define la acción al hacer clic sobre la miniatura de la imagen. Si seleccionas Archivo multimedia, abrirá la imagen (en tamaño real) directamente en la ventana del navegador y si seleccionas Página de adjuntos, abrirá la imagen dentro de una de las páginas de WordPress.
- Columnas: especifica el número de columnas para usar al mostrar las miniaturas de las imágenes. Esto dependerá del tema que uses y del ancho de la página. Si compruebas que la galería no se muestra correctamente tras modificar este valor, puede que necesites cambiarlo.
- Orden aleatorio: sirve para mostrar las imágenes ordenadas al azar.
- Tamaño: selecciona el tamaño de la imagen para usar en la galería.
Editar o borrar una galería de imágenes
Editar o borrar una galería de imágenes se parece mucho a editar o borrar una imagen cualquiera y lo vas a comprobar ahora.
Primero selecciona la galería de imágenes. Verás que aparecen 2 iconos en la parte superior de la galería. Al hacer clic en el botón Editar podrás editar las propiedades de la galería en una ventana emergente y al hacer clic en el botón Eliminar la borrarás. Como hemos visto con las fotos, se borrará del contenido en el que estés trabajando, pero no desaparecerá de la biblioteca multimedia.
Insertar una lista de reproducción de audio o vídeo
Insertar una lista de reproducción de audio o vídeo es casi idéntico a insertar una imagen.
Primero pincha en el botón Añadir objeto. Aparecerá una ventana emergente igual a la que se muestra cuando añades una imagen. Puedes subir nuevos archivos de multimedia para usar en tu lista de reproducción o puedes seleccionar los que hayas subido previamente.
Si quieres subir un archivo multimedia nuevo, haz clic en el enlace Subir archivos de la parte superior de la ventana emergente.
Para crear una lista de reproducción de audio, pincha en el enlace Crear lista de reproducción de audios en la parte izquierda y para crear una de vídeo, haz clic en el enlace Crear lista de reproducción de vídeos de la parte izquierda. Según la opción que elijas, verás tu lista de audios o de vídeos.
Tras seleccionar los archivos, haz clic en el botón Crear una nueva lista de reproducción en la parte inferior y solo verás los archivos multimedia seleccionados, que serán los que se usen en la publicación.
Para ordenar los archivos, simplemente pincha y arrastre el archivo hasta la nueva posición.
Como con las fotos, puedes cambiar el título de cada archivo haciendo clic en el texto que aparece debajo de cada archivo. O puedes pinchar y actualizar el título, la leyenda y la descripción en la parte derecha de la ventana emergente.
Además, puedes decidir qué elementos quieres que se vean y cambiar la apariencia de la lista de reproducción en la página.
Si quieres eliminar algún elemento de la lista de reproducción, haz clic en la pequeña ‘x’ que aparece en la esquina superior derecha del archivo al posar el puntero del ratón.
Ajustes de apariencia de las listas de reproducción de audio
Estos son los parámetros que puedes modificar:
- Mostrar lista de reproducción: al pinchar, verás los archivos de audio dentro de la lista de reproducción.
- Mostrar nombre de artista en la lista de pistas: si seleccionas esta casilla, se mostrará el nombre del artista junto a cada pista.
- Mostrar imágenes: sirve para mostrar la imagen asociada al archivo de audio.
Ajustes de apariencia de una lista de reproducción de vídeo
En el caso de los vídeos, podrás cambiar los siguientes campos.
- Mostrar lista de vídeos: si seleccionas esta casilla, verás todos los vídeos que hay dentro de la lista de reproducción.
- Mostrar imágenes: aquí eliges si se muestra la imagen asociada al archivo de vídeo.
Insertar vídeo, audio u otro tipo de archivo
El procedimiento para insertar cualquier otro tipo de archivo en una página o en un artículo del blog es igual que los pasos que hemos visto para insertar una imagen.
Solo tienes que hacer clic en el botón Añadir objeto. Una vez que aparece la ventana emergente correspondiente, sigue los mismos pasos que si estuvieras subiendo una foto.
Cuando insertes archivos de vídeo o de audio, puedes seleccionar Incrustar reproductor de medios de la lista desplegable Incrustar o enlazar de la ventana emergente Insertar objeto, para usar los nuevos reproductores de audio y vídeo que ahora incluye WordPress. Los formatos de archivos de audio y de vídeo admitidos son: M4A, MP4, OGG, WebM, FLV, WMV, MP3, WAV y WMA.
Es recomendable que el nombre del archivo sea “amigable” con los servidores. Por eso, asegúrate de que el nombre del archivo no contenga espacios, acentos u otros caracteres alfanuméricos (como %, & o $) y facilita la lectura por medio de guiones entre las palabras.
Incrustar un vídeo, imagen u otro contenido
Otra manera de agregar vídeos o cualquier otro tipo de contenido es a través de la incrustación (“embedding”).
¿No tienes muy claro qué es un archivo incrustado?
Cuando incrustas un vídeo, no lo subes a tu web, sino que creas un enlace al archivo, desde la misma página, porque WordPress es capaz de incrustar automáticamente los archivos desde una amplia lista de servicios.
Así para incrustar un vídeo o un audio en un post o en una página, solo tienes que pegar la URL en el área del contenido donde quieres que se muestre.
Por cierto, acuérdate de poner la URL en una línea independiente y sin hipervínculo.
Cuando se incrusta el contenido de esta manera, la URL cambiará de manera tal que se mostrará una vista previa de ese contenido.
Por ejemplo, al incrustar un vídeo de YouTube, al pegar la URL en el editor, mágicamente mostrará el contenido real del vídeo dentro del editor.
Si quieres especificar el ancho (width) y la altura (height), puedes envolver la URL en un código abreviado:
Cuando incrustes archivos con este código abreviado, no es necesario que la URL esté en una línea aparte.
¿De qué sitios incrusta WordPress contenidos de forma automática?
Si alguna vez te lo has preguntado o quieres saber de qué sitios puedes incrustar la URL, aquí tienes el listado.
¿Qué vas a estrenar primero? ¿Los vídeos? ¿Las listas de reproducción? ¿Vas a subir fotos? Te espero en los comentarios.
Fuente de imagen: Shutterstock
