Muestra videos, imágenes y audio en tu sitio web para captar la atención de los visitantes. Utiliza estos widgets para destacar tus productos y aumentar la interacción en tus páginas.
El widget Media Slider ofrece diapositivas de vídeo, imagen y texto con diversos diseños. Utilice este widget para testimonios, preguntas frecuentes, presentaciones de productos o secciones de servicio para ofrecer contenido interactivo a los visitantes.
Antes de comenzar
- El sonido está desactivado para los vídeos que se utilizan como fondos de diapositivas.
- La reproducción automática de vídeo depende de las restricciones del navegador y de los ajustes del dispositivo, como el modo de bajo consumo. Para obtener ayuda, consulte la sección «Solución de problemas del widget de vídeo».
- Se puede incluir un máximo de 25 diapositivas.
- Los formatos de archivo compatibles incluyen
.svg, .png, .jpg, .gify todos los formatos de vídeo.
- Haz clic en el widget y selecciona la pestaña Contenido.
- Para agregar una nueva diapositiva, haz clic en Agregar nueva diapositiva.
- Selecciona + Haz clic para agregar contenido multimedia y abrir la Biblioteca multimedia.
- Para añadir nuevas imágenes a tu biblioteca multimedia, ve a la pestaña Imágenes:
- Haz clic en + Subir imágenes para añadir imágenes desde tu ordenador. Puedes seleccionar varias imágenes.
- Haz clic en Importar imágenes para importar imágenes desde una fuente externa:
- Selecciona Desde un sitio, ingresa el sitio web correspondiente y haz clic en Mostrar imágenes. Selecciona las imágenes correspondientes y haz clic en Importar imágenes.
- Selecciona una plataforma en línea, conéctate a la plataforma correspondiente y sigue las instrucciones en pantalla.
- Haz clic en Listo.
-
Para añadir nuevos vídeos a tu biblioteca multimedia, ve a la pestaña Vídeos:
Haz clic en + Subir vídeos, conecta la plataforma correspondiente y sigue las instrucciones en pantalla.
- Haz clic en Listo.
Acciones adicionales:
- Para duplicar una diapositiva, coloque el cursor sobre la diapositiva y haga clic.
- Para reemplazar una diapositiva, seleccione la diapositiva y haga clic.
junto a "Reemplazar". - Para eliminar una diapositiva, coloque el cursor sobre la diapositiva y haga clic.
o seleccione la diapositiva y haga clic. junto a "Reemplazar". - Para posicionar la diapositiva, seleccione la posición direccional correspondiente.
- Para agregar texto alternativo, ingrese el texto requerido debajo de "Etiqueta de texto alternativo de imagen" o haga clic en el
para usar el Asistente de IA, el cual genera un texto alternativo en el idioma actual de la página. - Para añadir texto a la diapositiva, introduzca el texto deseado en el campo correspondiente.
- Para agregar una descripción a la diapositiva, ingrese el texto requerido en el campo correspondiente.
- Para mostrar u ocultar un botón en la diapositiva, haga clic.
Introduzca el texto del botón en el campo correspondiente. - Para añadir un enlace al botón, haga clic en Añadir un enlace y seleccione la opción correspondiente.
- Para eliminar todas las diapositivas, haga clic en Eliminar todo.
Inserta imágenes para decorar tu sitio web o mostrar tus productos. También puedes configurarlas como botones que enlacen a otras páginas, archivos o ventanas emergentes.
Antes de comenzar
- Los sitios admiten hasta 15.000 archivos multimedia.
- El límite de tamaño por archivo es de 50 MB.
- Evita usar espacios o caracteres especiales en los nombres de archivo.
- Asegúrate de tener permiso para usar fotos de terceros.
- Tipos de archivo compatibles:
png, jpg, jpeg, gif, svg, webp, ico.
- Haz clic en el widget y selecciona la pestaña Contenido.
-
En la ventana emergente "Vista rápida del selector de imágenes", busca y selecciona imágenes, texturas o GIF. También puedes hacer clic en "+ Cargar" para seleccionar fotos de tus archivos personales. Puedes seleccionar varias imágenes.
Haz clic en Vista completa para ver más opciones de imágenes.
- Para eliminar el fondo de la imagen, haga clic aquí.
junto a "Reemplazar". - Para agregar texto alternativo, ingrese el texto requerido en "Etiqueta de texto alternativo de la imagen" o haga clic . El Asistente de IA genera un texto alternativo en el idioma actual de la página.
- Para reemplazar una imagen, seleccione la diapositiva y haga clic. junto a "Reemplazar".
- Para agregar una información emergente a la imagen al pasar el cursor sobre ella, ingrese el texto requerido en el campo "Información emergente".
- Para añadir un pie de foto a la imagen al pasar el cursor por encima, introduzca el texto necesario en el campo "Pie de foto".
- Para reemplazar la imagen al pasar el cursor sobre ella, haga clic en + Imagen y seleccione la imagen deseada.
- Haga clic en junto a "Reemplazar" para editar la imagen alternativa. Más información sobre el editor de imágenes. Haga clic en Guardar.
- Haga clic en junto a "Reemplazar" para eliminar la imagen alternativa.
- Para agregar texto alternativo, ingrese el texto requerido en "Etiqueta de texto alternativo de la imagen" o haga clic para usar el Asistente de IA, el cual genera un texto alternativo en el idioma actual de la página.
- Haga clic en
- Para eliminar el fondo de la imagen, haga clic aquí.
Haz clic en el widget y selecciona la pestaña Diseño para cambiar la disposición de la imagen, las animaciones, las opciones de visualización y el estilo.
Nota:
Deshabilitar la optimización de imágenes podría afectar la velocidad y/o el rendimiento de la página.
Utiliza el carrusel de imágenes para mostrar testimonios, preguntas frecuentes, presentaciones de productos o secciones de servicio en tu sitio web. Esto genera confianza y fideliza a tus clientes.
Antes de comenzar
Los formatos de archivo compatibles incluyen .svg, .png, .jpg, .gif y todos los formatos de vídeo.
- Haz clic en el widget y selecciona la pestaña Contenido.
- Para añadir una nueva imagen, haz clic en Añadir imagen.
- Haz clic en + Subir imágenes para añadir imágenes desde tu ordenador. Puedes seleccionar varias imágenes.
- Haz clic en Importar imágenes para importar imágenes desde una fuente externa:
- Selecciona Desde un sitio, ingresa el sitio web correspondiente y haz clic en Mostrar imágenes. Selecciona las imágenes correspondientes y haz clic en Importar imágenes.
- Selecciona una plataforma en línea, conéctate a la plataforma correspondiente y sigue las instrucciones en pantalla.
- Selecciona las imágenes correspondientes y haz clic en Listo.
- Haz clic en la X de una imagen para eliminarla. También puedes hacer clic en Eliminar todas las imágenes para borrarlas todas.
Ajustes de imagen
Haz clic en una imagen existente para abrir los Ajustes de imagen, donde encontrarás los siguientes ajustes adicionales:
- Para reemplazar una imagen, haga clic en el icono del lápiz junto a "Reemplazar".
- Para eliminar una imagen, haga clic en el icono de papelera junto a "Reemplazar".
- Para posicionar la diapositiva, seleccione la posición direccional correspondiente.
- Para añadir un enlace al botón, haga clic en Añadir un enlace y seleccione la opción correspondiente.
- Para mostrar u ocultar el título de una imagen, haga clic en el icono . A continuación, introduzca el texto requerido en el campo "Título del control deslizante".
- Para mostrar u ocultar el pie de foto de una imagen, haga clic en el icono . A continuación, introduzca el texto requerido en el campo "Título del control deslizante".
- Para mostrar u ocultar un botón en la diapositiva, haga clic en el icono . A continuación, introduzca el texto del botón en el campo correspondiente.
- Para agregar texto alternativo, ingrese el texto requerido debajo de "Etiqueta de texto alternativo de imagen" o haga clic en el icono de IA para usar el Asistente de IA, que genera un texto alternativo en el idioma actual de la página.
Anade varias imagenes a la vez con el widget de Galeria de fotos. Los visitantes pueden abrir las imagenes en una galeria emergente o hacer clic en ellas para acceder a enlaces, anclas o direcciones de correo electronico.
- Haz clic en el widget y selecciona la pestana Contenido.
- Haz clic en + Imagen para anadir una nueva imagen.
-
En la ventana emergente "Vista rapida del selector de imagenes", busca y selecciona imagenes, texturas o GIF. Tambien puedes hacer clic en "+ Cargar" para seleccionar fotos de tus archivos personales. Puedes seleccionar varias imagenes.
Haz clic en Vista completa para ver mas opciones de imagenes.
- Haz clic en Listo.
- Seleccione una imagen para abrir sus ajustes:
- Para reemplazar una imagen, haga clic aquí junto a "Reemplazar".
- Para eliminar una imagen, haga clic aquí junto a "Reemplazar".
- Para posicionar la diapositiva, seleccione la posición direccional correspondiente.
- Para añadir un enlace al botón, haga clic en Añadir un enlace y seleccione la opción correspondiente.
- Para mostrar u ocultar el título de una imagen, haga clic aquí. Introduzca el texto requerido en el campo "Título".
- Para mostrar u ocultar la descripción de una imagen, haga clic aquí. Introduzca el texto requerido en el campo "Descripción".
- Para mostrar u ocultar un botón en la diapositiva, haga clic aquí. Introduzca el texto del botón en el campo correspondiente.
- Para agregar texto alternativo, ingrese el texto requerido debajo de "Etiqueta de texto alternativo de imagen" o haga clic en el para usar el Asistente de IA. Este genera un texto alternativo en el idioma actual de la página.
- Para reemplazar una imagen, haga clic aquí
- Opcional: Active la opción "Habilitar enlaces en las imágenes de la galería" para habilitar los enlaces en las imágenes de la galería.
- Haz clic en la X de una imagen para eliminarla. Si lo prefieres, haz clic en Eliminar todas las imágenes para borrarlas todas.
Agregar un feed de Instagram
Los usuarios con una cuenta de Instagram privada o pública (no cuentas de empresa) pueden añadir un feed de Instagram al widget de la galería de fotos.
Seleccione entre una biblioteca de más de 1000 iconos prediseñados o suba su propio archivo SVG.
Antes de comenzar
- Los archivos SVG se pueden redimensionar sin perder resolución.
- Para mantener la velocidad del sitio, simplifique el código SVG complejo utilizando una herramienta de optimización o convierta los vectores de alto detalle en formatos planos como .png, .jpeg, etc.
- Haga clic en el widget y seleccione la pestaña Contenido.
- Haga clic en Cambiar icono para abrir la biblioteca de iconos.
- Busque y seleccione un icono. Si lo prefiere, haga clic en + Cargar para añadir archivos desde una plataforma de terceros.
- Para vincular el icono, haga clic en Vincular icono y seleccione la opción correspondiente.
- Escriba el texto alternativo para el icono o haga clic. Utilice el Asistente de IA para generar texto alternativo. El texto alternativo permite a los motores de búsqueda reconocer el contenido de los iconos. Use un texto que describa claramente el icono.
Haga clic en el widget y seleccione la pestaña Diseño para cambiar la disposición de los iconos, las animaciones, las opciones de visualización y el estilo de los botones.
Active la opción Flotante para fijar el icono en una posición fija en la pantalla.
Sube vídeos o inserta contenido de YouTube, Vimeo o Dailymotion. Los vídeos son una forma eficaz de comunicar el valor de tu negocio y aumentar las conversiones.
Antes de comenzar
- Los archivos subidos son públicos. No subas información confidencial.
- Subir un vídeo no afecta a la velocidad del sitio web.
- Los sitios admiten hasta 100 archivos de vídeo.
- El límite de tamaño por archivo es de 200 MB.
- Haz clic en el widget y selecciona la pestaña Contenido.
- Haz clic en «Seleccionar vídeo» para elegir un vídeo de la biblioteca. Haz clic en «+ Subir» para añadir archivos desde una plataforma externa. También puedes pegar la URL de YouTube, Vimeo o Dailymotion.
- Activa la opción "Ocultar vídeos relacionados" para desactivar las recomendaciones de vídeos relacionados de la plataforma que has utilizado.
- Para eliminar un vídeo, haz clic en Eliminar.
Haz clic en el widget y selecciona la pestaña Diseño para personalizar la apariencia del vídeo.
Utiliza el widget de formas para resaltar mensajes, crear botones personalizados o destacar precios de oferta. Puedes añadir imágenes, texto y sombras a cualquier forma.
- Haz clic en el widget y selecciona la pestaña Contenido.
- Selecciona la forma que prefieras.
- Haz clic en Agregar enlace para que sea interactivo. Selecciona la opción correspondiente.
- Para mostrar u ocultar un título, haz clic aquí. Introduce el texto requerido en el campo "Título".
- Para mostrar u ocultar una descripción, haz clic aquí. Introduce el texto requerido en el campo "Descripción".
- Para mostrar u ocultar una información sobre herramientas en la diapositiva, haz clic en Introduce el texto para la información emergente en el campo correspondiente.
- Para agregar texto alternativo, introduce el texto requerido debajo de "Etiqueta de texto alternativo de imagen" o haz clic en el Para usar el Asistente de IA, este genera un texto alternativo en el idioma actual de la página.
Haz clic en el widget y selecciona la pestaña Diseño para personalizar la apariencia del icono.
- Haz clic en Espaciado para usar márgenes negativos si quieres superponer otros widgets.
- Activa la opción Flotante para fijar la forma en una posición fija en la pantalla.
Para crear una forma en el encabezado:
- Crea una fila con dos columnas.
- Elige una forma amorfa y añádela a la columna de la derecha.
- Haz la figura tan grande como la columna.
- En el editor de diseño, selecciona la maquetación con la imagen de fondo y sustituye la imagen por la que desees.
Para usar una forma como botón añadiéndole un enlace y un efecto al pasar el ratón por encima:
- Selecciona la forma circular y añade un título y una descripción.
- Selecciona los colores para la forma y el texto.
- Para colocar la forma en la esquina de una imagen, utiliza un margen negativo en el lado izquierdo de la forma (espaciado > margen > -50px margen izquierdo y superior).
Para utilizar formas geométricas para resaltar un plan o servicio específico:
- Elija la forma de la bandera y añada un título y una breve descripción.
- Desactive la opción "Mantener proporción" para poder ajustar únicamente el ancho.
- Seleccione los colores para la forma y el texto.
- Para posicionar la forma de manera que se superponga a la parte superior de una columna, utilice un margen superior negativo (espaciado > margen > -30px de margen superior).
o utilice una forma para crear un botón de desplazamiento:
- Elija la forma del diamante y añada un título.
- Desactive la opción "Mantener proporción" para poder ajustar únicamente el ancho.
- Seleccione los colores para la forma y el texto.
- Para colocar la forma encima de una imagen, utilice un margen superior negativo (espaciado > margen > margen superior de -50px).
Muestra una comparación visual llamativa con el widget Antes y Después. Incluye un control deslizante que los visitantes pueden usar para alternar entre dos imágenes.
- Haz clic en el widget y selecciona la pestaña Contenido.
- Imagen anterior: Haz clic en + Imagen para seleccionar su "Imagen anterior".
- Imagen posterior: Haz clic en + Imagen para seleccionar su "Imagen posterior".
- Seleccione una imagen para abrir sus ajustes:
- Para reemplazar una imagen, haz clic aquí junto a "Reemplazar".
- Para eliminar una imagen, haz clic aquí junto a "Reemplazar".
- Para etiquetar la imagen, introduce el texto necesario en el campo "Etiqueta".
- Para agregar texto alternativo, ingresa el texto requerido debajo de "Etiqueta de texto alternativo de imagen" o haz clic en el . Para usar el Asistente de IA, este genera un texto alternativo en el idioma actual de la página.
- Para reemplazar una imagen, haz clic aquí
Haz clic en el widget y selecciona la pestaña Diseño para personalizar su apariencia:
- Haz clic en Imágenes y control deslizante para personalizar la apariencia del control deslizante.
- Utiliza la sección Etiquetas para dar formato al texto para diferentes dispositivos.
Comparte pódcasts, canciones o tutoriales insertando archivos de SoundCloud o Mixcloud. Copia el enlace de la fuente y añádelo a tu sitio web mediante el widget.
- Haz clic en el widget y selecciona la pestaña Editar.
- Haz clic en Seleccionar audio para elegir un archivo de audio. Haz clic en + Subir audio para añadir un archivo de audio desde una plataforma externa. También puedes pegar la URL de SoundCloud o Mixcloud en el campo.
Haz clic en el widget y selecciona la pestaña Diseño para personalizar su apariencia.
Las opciones de diseño dependen de la plataforma utilizada. Para mantener la coherencia en el diseño, utiliza la misma plataforma (SoundCloud o Mixcloud) para todos los archivos de audio de tu sitio web.
Añade animaciones vectoriales de alta calidad a tu sitio web con el widget de animación de Lottie. Puedes explorar LottieFiles para encontrar animaciones ya existentes o subir tus propios archivos JSON.
- Haz clic en el widget y selecciona la pestaña Contenido.
- Pega la URL de la animación de Lottie.
- Selecciona Animación en bucle o Animar al hacer clic.
- Para añadir un enlace al botón, haz clic en Añadir un enlace y selecciona la opción correspondiente.
Nota:
Si utilizas un archivo LottieFile gratuito, debes incluir las credenciales del creador según lo estipulado en el acuerdo de licencia.
Haz clic en el widget y selecciona la pestaña Diseño para cambiar el tamaño de la animación o bloquear sus proporciones.
