Mostrar imágenes de gran formato en un carrusel de imágenes

Con el elemento de contenido Carrusel de imágenes, puedes mostrar diversas imágenes de gran formato una después de otra. Esto puede ser útil, por ejemplo, para destacar partes de tu tienda, como una categoría de productos específica, ya que también puedes añadir texto y enlaces a las imágenes en el carrusel de imágenes.

Example_ImageSlider_EN.gif

Asegúrate siempre de que tus imágenes se vean bien en todo tipo de dispositivos. Tu tienda está adaptada a dispositivos móviles, lo que significa que el diseño se optimizará automáticamente según el dispositivo que utilice el usuario. Para más información, consulta ¿Qué significa «adaptado a dispositivos móviles»?

Cómo añadir un carrusel de imágenes

Estos son los pasos a seguir para añadir un carrusel de imágenes a una página y cargar las imágenes que te gustaría usar:

  1. En la barra lateral de la administración, dirígete a Editor.
  2. Verás una lista de tus páginas en la barra lateral del Editor en Páginas.
    Selecciona la página a la que deseas añadir el carrusel de imágenes o añade una página de contenido nueva. Se mostrará una vista previa de la página en la parte derecha.
  3. En la barra lateral del Editor, selecciona Elementos de contenido.
  4. Selecciona la categoría Imágenes o Galería.
  5. Arrastra y suelta el elemento de contenido Carrusel de imágenes en el área de vista previa. Tan solo puedes soltar elementos de contenido en las áreas azules de la página.
  6. Selecciona Añadir imágenes.
    Aparece la vista Añadir imágenes. Aquí puedes asignar un total de hasta 5 imágenes al carrusel de imágenes.
  7. Arrastra y suelta la imagen en el campo Añadir imagen o selecciona Añadir imagen para elegir la imagen desde tu dispositivo.
  8. Espera hasta que la imagen se haya cargado.
  9. Establece la alineación de la imagen. Puedes utilizar arriba ImageAlignment_Top.png, abajo ImageAlignment_Bottom.png o en el centro ImageAlignment_Middle.png como el centro de la imagen. Para más información, consulta la sección Aprender más sobre la alineación de la imagen.
  10. Si quieres, también puedes introducir un Texto alternativo. Esto se utilizará para propósitos de optimización de motores de búsqueda y puede ser leído por lectores de pantalla para usuarios ciegos o con discapacidad visual. También se muestra en caso de que la imagen no pueda verse.
  11. Si quieres añadir textos a tu imagen, realiza las opciones necesarias en las pestañas AddTextOnImage.png y ModifyColours.png. Para más información, consulta Añadir texto/enlaces a imágenes.
  12. Si quieres añadir más imágenes al carrusel, selecciona el siguiente espacio vacío en la pequeña vista previa del carrusel de imágenes de la parte superior circle-1.png y repite los pasos 7-11.
  13. Tú decides la velocidad con la que deberán ir pasando las imágenes. Para ello, mueve el carrusel a Las imágenes cambian cada ... segundos circle-2.png . Por defecto, las imágenes cambiarán cada 5 segundos. Alternativamente, también puedes establecer una velocidad de 1-10 segundos.

    EditImageSlider_View_EN_unedited.png
  14. Cuando hayas terminado, selecciona Guardar.

El carrusel de imágenes se ha añadido correctamente a tu tienda.

Para editar el carrusel de imágenes de nuevo, selecciónalo o pasa el ratón por encima y selecciona EditCircleIcon.png en la esquina derecha superior. La vista Editar carrusel de imágenes aparece y podrás realizar los cambios deseados.

Información

Para todos los elementos de contenido, puedes configurar más opciones mediante la barra azul que aparece cuando pasas el ratón por encima de un elemento de contenido. Puedes moverlo utilizando la función de arrastrar y soltar Screenshot 2023-12-06 at 15.04.46.png , borrarlo DeleteIconBlue.png , editar su diseño de fondo EditColourIcon.png y seleccionar una animación Animation.png .

Cómo cambiar el orden de las imágenes

Para mover una imagen concreta a otra posición dentro del orden de rotación establecido, arrastra y suelta la imagen concreta en la vista previa pequeña del carrusel de imágenes de la parte superior. Cualquier texto/enlace adicional que hayas establecido para aquella imagen también se moverá.

Order_ImageSlider_EN.gif

Aprender más sobre la alineación de la imagen

La manera en que se muestran las imágenes en el carrusel de imágenes en tu tienda depende del formato original de la imagen y del dispositivo que utilicen tus clientes. Por esta razón, la imagen puede mostrase cortada. Para evitar que las partes más importantes de una imagen se muestren cortadas, puedes alinear las imágenes correspondientemente.

Cuando estableces la alineación de la imagen, asegúrate de seleccionar la opción que muestre la parte de la imagen que sea más importante para ti. Actualmente no es posible posicionar la imagen libremente. En lugar de ello, tendrás que seleccionar una de las tres opciones que se listan en Alineación de la imagen. Estas son: arriba ImageAlignment_Top.png, abajo ImageAlignment_Bottom.png y en el centro ImageAlignment_Middle.png.

¿Fue útil este artículo?

Usuarios a los que les pareció útil: 1 de 2