Widget de control deslizante de imagen

Agregue un widget de control deslizante de imágenes a su sitio para mostrar un conjunto de imágenes, una después de la otra, en una fila o columna. Puede agregar varias imágenes que se mostrarán como una presentación. En lugar de tener múltiples widgets de imagen atestando sus filas y columnas, use un único widget de control deslizante de imágenes.

Agrupar todas sus fotos en un widget es útil y ahorra mucho espacio. Sin embargo, ciertos casos requieren imágenes individuales. Por ejemplo, pudiera necesitar un párrafo que explique una imagen individual que no se pueda incluir en un grupo de imágenes en el control deslizante de imágenes. Para obtener más información sobre el widget de imagen, consulte Widget de imagen.

Para agregar el control deslizante de imagen widget:

  1. En el panel izquierdo, haga clic en Widgets.
  2. Haga clic y arrastre el widget a su sitio.

Para obtener más información sobre cómo agregar widgets a su sitio, consulte Agregar widgets.

Editor de contenido

Para acceder al editor de contenido, haga clic con el botón derecho en el widget y haga clic en Editar contenido.

Agregar imágenes

Para agregar una imagen al control deslizante, haga clic en Agregar imagen o haga clic en cualquier punto de la imagen en blanco. Esto abrirá el selector de imágenes. Tiene las siguientes opciones:

  • Seleccione la carpeta con las imágenes que desea usar.
  • Haga clic en el icono + para cargar su propia imagen.
  • Haga clic en Vista completa para obtener más opciones de elección de imagen.

Quitar imágenes

En el Editor de contenidos, haga clic en la X de color gris en la esquina superior de la miniatura de imagen para eliminarla.

Configuración de imagen

Haga clic en una imagen existente en el editor de contenidos para abrir la Configuración de imagen.

Editar y reemplazar imágenes

  • Para abrir el selector de imágenes y seleccionar una imagen diferente, haga clic en Reemplazar.
  • Para abrir el editor de imágenes incorporado para agregar funciones y estilos a una imagen, haga clic en Editar.

Tiene las siguientes opciones adicionales en la Configuración de imágenes:

  • Agregar un enlace a la diapositiva. Convierte toda la imagen en un botón que se puede vincular.
  • Título de control deslizante. Agrega texto grande a la imagen del control deslizante.
  • Leyenda del control deslizante. Agrega un texto más pequeño a la imagen del control deslizante debajo del texto del título. Utilice el Editor de texto enriquecido para agregar color, énfasis (negrita, cursiva y subrayado) y viñetas al texto en el cuadro de la leyenda.
  • Botón. Agrega un botón a la imagen del control deslizante que se puede enlazar como un widget de botón.
  • Texto alternativo. Agrega texto alternativo que se mostrará por motivos de optimización de motores de búsqueda (SEO) o cuando la imagen no se pueda mostrar.

Editor de diseño

Para acceder al editor de diseño, haga clic con el botón derecho en el widget y haga clic en Editar diseño.

Transición

En el editor de diseño, desplácese hasta la transición y configure lo siguiente:

  • Transición del deslizador. Seleccione Aparición gradual o Deslizamiento.
  • Reproducción automática.
  • Velocidad de la presentación de diapositivas. Mueva el deslizador para seleccionar una velocidad de entre 1 y 20 segundos.
  • Pausar la presentación de diapositivas en hover.
  • Animación de contenido. Seleccione una animación de la lista desplegable.

Mostrar imágenes completas

Cuando se agreguen imágenes al control deslizante de imágenes, no se mostrarán en sus dimensiones naturales. Estas imágenes se muestran de manera que llenen las dimensiones del control deslizante de imágenes, por lo que pueden aparecer estiradas o borrosas. Para mostrar imágenes en sus dimensiones naturales, en el editor de diseño haga clic en el botón Marco, luego haga clic en el botón de alternancia Mostrar imagen completa.

Para obtener información sobre las opciones de diseño que no son específicas de este widget (por ejemplo, diseño, estilo o espaciado), consulte Diseño de widgets.