Cómo cambiar una imagen
El constructor visual de Divi 5 permite modificar las imágenes de tu sitio web fácilmente, sin necesidad de conocimientos técnicos.
Podrás sustituir fotografías de productos, servicios, instalaciones o cualquier otro contenido visual, manteniendo el diseño original de tu página.
A continuación, te explicamos cómo hacerlo paso a paso.
1. Abre la página que deseas modificar
Accede al panel de administración de WordPress.
En el menú lateral, selecciona Páginas → Todas las páginas.
Localiza la página que contiene la imagen que deseas cambiar.
Abre la página con Divi 5 para acceder al constructor visual.
Una vez dentro, podrás visualizar los diferentes elementos de la página y localizar la fotografía que quieres sustituir.
2. Localiza el módulo de imagen
Las páginas de Divi están formadas por distintos módulos que contienen textos, imágenes, botones y otros elementos.
Para cambiar una fotografía:
Desplázate por la página hasta encontrar la imagen.
Sitúa el cursor sobre ella.
Selecciona el módulo que contiene la fotografía.
Haz clic en el icono del engranaje para abrir su configuración.
Normalmente, las fotografías se encuentran dentro de un módulo de Imagen, aunque también pueden formar parte de otros módulos o utilizarse como fondos de secciones.
3. Selecciona una nueva imagen
Una vez abierta la configuración del módulo:
Accede al apartado Contenido.
Localiza el campo que muestra la imagen actual.
Haz clic sobre la imagen o en la opción que permite sustituirla.
Se abrirá la biblioteca multimedia de WordPress.
Selecciona la nueva fotografía que deseas utilizar.
Si la imagen ya está subida a WordPress, podrás seleccionarla directamente desde la biblioteca.
Si todavía no está disponible, tendrás que subirla siguiendo los pasos del siguiente apartado.
4. Sube una nueva imagen a WordPress
Para añadir una fotografía nueva:
Dentro de la biblioteca multimedia, selecciona la pestaña Subir archivos.
Haz clic en Seleccionar archivos o arrastra la imagen desde tu ordenador.
Espera a que termine de subirse.
Comprueba que la imagen seleccionada es la correcta.
Haz clic en el botón de confirmación para insertarla en el módulo.
WordPress guardará automáticamente el archivo en su biblioteca multimedia, por lo que podrás volver a utilizarlo en otras páginas.
5. Añade un texto alternativo
El texto alternativo, también conocido como Alt Text, es una breve descripción de la imagen que ayuda a mejorar la accesibilidad del sitio web y permite a los buscadores comprender mejor su contenido.
Para añadirlo:
Selecciona la imagen en la biblioteca multimedia.
Localiza el campo Texto alternativo.
Escribe una descripción breve y clara de lo que aparece en la fotografía.
Confirma la selección de la imagen.
Por ejemplo, si la fotografía muestra un tractor trabajando en el campo, puedes utilizar:
«Tractor agrícola trabajando en un campo de cultivo».
Evita utilizar descripciones genéricas como «imagen» o «fotografía».
Si la imagen es únicamente decorativa y no aporta información, puede ser adecuado dejar el texto alternativo vacío.
6. Comprueba que la imagen se visualiza correctamente
Una vez sustituida la fotografía, revisa cómo aparece en la página.
Comprueba especialmente que:
La imagen no se vea borrosa o pixelada.
No aparezca deformada o estirada.
Mantenga una proporción similar a la fotografía original.
No se recorten elementos importantes.
Se visualice correctamente tanto en ordenador como en móvil.
Consejo: si la imagen original era horizontal, utiliza otra fotografía horizontal con una proporción parecida. De esta forma evitarás cambios inesperados en el diseño.
7. Guarda los cambios
Cuando hayas terminado:
Comprueba que la nueva imagen se muestra correctamente.
Confirma las modificaciones del módulo, si corresponde.
Utiliza la opción Guardar del constructor visual de Divi 5.
Espera a que finalice el proceso de guardado.
Sal del constructor visual.
Visita la página publicada y comprueba el resultado.
Recuerda que debes guardar los cambios generales de la página para que la nueva imagen quede publicada.
Buenas prácticas para utilizar imágenes en tu web
Para mantener una buena calidad visual sin perjudicar la velocidad de carga, te recomendamos seguir estas pautas.
1. Utiliza imágenes optimizadas
Siempre que sea posible, utiliza fotografías en formato WebP o JPEG, ya que permiten obtener una buena calidad con archivos relativamente ligeros.
2. Evita archivos excesivamente pesados
Como referencia general, intenta que las imágenes habituales no superen los 200-300 KB cuando sea posible sin perder calidad apreciable. Las fotografías de gran tamaño o utilizadas como fondos pueden necesitar archivos algo mayores.
3. Mantén las proporciones originales
Si sustituyes una imagen cuadrada, utiliza otra cuadrada. Si es panorámica, procura mantener una relación de aspecto similar.
4. Utiliza imágenes de buena calidad
Evita fotografías pequeñas que tengan que ampliarse demasiado, ya que podrían aparecer pixeladas.
5. Añade textos alternativos descriptivos
Cuando la imagen aporte información, describe brevemente su contenido. Esto mejora la accesibilidad y puede contribuir al posicionamiento en buscadores.
6. Evita subir fotografías duplicadas
Antes de subir una imagen nueva, comprueba si ya está disponible en la biblioteca multimedia de WordPress.
Recomendaciones finales
Cambiar una fotografía es una de las tareas más habituales del mantenimiento de una página web.
Siguiendo estos pasos podrás mantener actualizadas las imágenes de tu sitio sin modificar su estructura ni su diseño.
Importante: este tutorial está pensado para sustituir imágenes de contenido. Las imágenes utilizadas como fondos, los logotipos o las fotografías integradas en elementos especiales pueden requerir un procedimiento diferente. Si no encuentras la imagen dentro de un módulo, consulta con el administrador de la web antes de modificar otras configuraciones.
No se permite comentar en este curso.