Personaliza el fondo de los elementos para que combine con la temática de tu negocio con diseños llamativos y creativos. Elige entre imágenes de fondo personalizadas en la galería de fotos, sube tus propias imágenes, usa fondos de vídeo o aplica colores y degradados para darle un toque único a tu sitio web.
Nota:
Para conocer los fondos de la página, consulte Fondo del tema.
Cualquier archivo (texto, imagen, video o audio) subido al sistema es público. No se debe subir información personal ni confidencial. Para eliminar el archivo por completo, elimínelo del Administrador de Medios.
Para obtener detalles sobre las pautas de los medios, consulte Medios: pautas y especificaciones.
Consejo:
Todos los vídeos de YouTube en segundo plano muestran el título y el origen del vídeo antes de que se cargue. No es posible eliminar estos elementos sin modificar manualmente el CSS. Debido a este cambio, no se recomienda usar vídeos de YouTube como vídeo de fondo.
Para editar el fondo de los elementos:
- Para acceder al editor de diseño, haga clic derecho en el elemento y seleccione "Editar diseño". O bien, si está en modo flexible o Editor 2.0, seleccione "Editar diseño" en el menú flotante para abrir el panel de diseño.
- Vaya a la sección Fondo.
- Dependiendo del elemento, seleccione Color, Imagen o Video y seleccione el fondo deseado.
- Algunos elementos también incluyen la opción de deslizadores de imágenes. Para crear un deslizador de imágenes, seleccione varias imágenes y haga clic en Listo. Para obtener información detallada sobre los deslizadores de fondo, consulte Deslizadores de imágenes de fondo.
- Para obtener más detalles sobre las opciones de color, consulte Selector de color.
- (Opcional) Al seleccionar una imagen para fondo, haga clic en el botón No optimizar esta imagen para evitar la optimización si se utiliza una sola imagen (esta configuración aparecerá después de que se haya seleccionado una imagen).
Deslizadores de imágenes de fondo
Algunos contenedores ofrecen la opción de agregar un control deslizante de imagen de fondo.
Para crear un control deslizante de fondo:
- Para acceder al editor de diseño, haga clic derecho en el elemento y seleccione "Editar diseño". O bien, si está en modo flexible o Editor 2.0, seleccione "Editar diseño" en el menú flotante para abrir el panel de diseño.
- Vaya a la sección Fondo.
- Haga clic en la imagen.
- Haga clic en el signo + y seleccione varias imágenes en lugar de una sola en el selector de imágenes.
- Haga clic en Listo.
- (Opcional) Una vez creado el control deslizante, puede establecer ajustes de diapositivas, como el estilo de transición de diapositivas y la velocidad de diapositivas, desde el menú de diseño de filas.
- (Opcional) Cualquiera de las otras opciones de imagen de fondo, como Superposición de fondo, Posicionamiento y estilo de visualización, se pueden aplicar al control deslizante.
Configuración de la imagen de fondo
Una vez que se haya configurado una imagen o un control deslizante de imágenes, estarán disponibles opciones de configuración adicionales.
Si bien las opciones pueden variar, las dos más comunes son:
- Estilos de visualización de imágenes: Estas son las distintas maneras de controlar cómo se muestran las imágenes dentro del contenedor. Estas opciones permiten ajustar cómo una imagen se ajusta, se repite o se extiende para cubrir el área. Hay cuatro opciones:
- Cubrir: estira la imagen para cubrir toda el área sin perder su relación de aspecto (dado que cubre el área del contenedor, es posible que se corten partes de la imagen).
- Imagen completa: Muestra la imagen completa. Aunque no se cortará, puede que aparezcan barras a ambos lados, arriba y abajo, según el tamaño del contenedor.
- Mosaico: Repite la imagen completa en su tamaño original en un patrón de mosaico para rellenar el área. Si la imagen es más grande que el contenedor, no se repetirá.
- Sin repetición: Muestra la imagen completa en su tamaño original sin repetirla. Si la imagen es más grande que el contenedor, se cortará. Si es más pequeña que el contenedor, habrá espacio alrededor de la imagen.
- Tipo de posición de la imagen (solo Editor 2.0 y modo flexible): seleccione entre Predeterminado, Estático o Paralaje.
- Posición: Esta configuración determina dónde se coloca la imagen, como en el centro, arriba, abajo, a la izquierda o a la derecha del contenedor. Esta configuración funciona junto con las opciones de visualización de la imagen para controlar cómo se muestra.
- En el Editor 2.0 y el modo flexible, la posición de la imagen de fondo se establece según el tamaño de la pantalla.
Fondos de vídeo
Usa fondos de vídeo para añadir rápidamente un vídeo de YouTube, Vimeo o Dailymotion como fondo de tu sitio. Los fondos de vídeo captan la atención del visitante con su contenido dinámico y le dan un toque moderno y elegante a cualquier sitio.
Paso a paso:
- Para agregar un fondo de vídeo a su sitio, obtenga la URL de YouTube, Vimeo o Dailymotion que desee utilizar.
- Haga clic derecho en la fila o columna a la que desea agregar este fondo y luego haga clic en Editar diseño.
- Haz clic en la pestaña Vídeo. Tienes las siguientes opciones:
- Haz clic en "Subir vídeo" y selecciona el vídeo que quieras subir. Puedes subir hasta 200 MB en todos los formatos. Puedes subir vídeos desde tu dispositivo, Facebook, Instagram, Dropbox, Google Drive o grabar un vídeo con tu cámara web.
- Tenga en cuenta que esta función aún está en desarrollo y se lanzará gradualmente para todos los clientes.
- Pegue la URL del vídeo que desea utilizar en el cuadro de texto URL de YouTube, Vimeo o Dailymotion.
- Haz clic en "Subir vídeo" y selecciona el vídeo que quieras subir. Puedes subir hasta 200 MB en todos los formatos. Puedes subir vídeos desde tu dispositivo, Facebook, Instagram, Dropbox, Google Drive o grabar un vídeo con tu cámara web.
Consideraciones
- Los vídeos de YouTube no son compatibles con dispositivos móviles, ya que no se reproducen automáticamente en dispositivos iOS.
- Los iPhones con la batería en modo de bajo consumo no reproducirán vídeos automáticamente en un sitio y, en su lugar, mostrarán un botón de reproducción.
- Los vídeos de fondo no reproducirán sonido.
- Los vídeos pueden tardar tiempo y requerir mucho ancho de banda para cargarse y pueden distraer a los usuarios de enlaces o textos importantes en su página, así que úselos con moderación.
- Considere reducir la opacidad del fondo del vídeo para que el efecto sea más sutil.
- Al añadir un vídeo de Dailymotion a una lista de reproducción, asegúrate de añadir solo el enlace directo al vídeo (y omite el parámetro de lista de reproducción, que se ve así:?playlist=x1x2f3). Si la URL de tu vídeo tiene este parámetro, simplemente elimínalo.
- Por ejemplo: https://www.dailymotion.com/video/x60ktex?playlist=x5x6f2 sería https://www.dailymotion.com/video/x60ktex.
Solución de problemas y preguntas frecuentes
El vídeo no se reproduce automáticamente en el móvil.
Si usas un iPhone, el problema podría deberse al modo de bajo consumo. Desactivar este modo podría solucionarlo.
Otra posibilidad son los ajustes del navegador.
El vídeo no tiene sonido
Los vídeos de fondo no tienen sonido por defecto. Si tu vídeo lo requiere, considera usar el widget de vídeo.
Parte de mi vídeo o imagen está cortada
Esto se debe a que la relación de aspecto de la imagen o el vídeo es diferente a la del contenedor.
Dependiendo de tu objetivo, esto puede ser difícil de manejar. Si la imagen o el vídeo debe ajustarse a un tamaño que cambia según el tamaño de la pantalla, no existe una solución perfecta para evitar que se corte. La parte visible de la imagen o el vídeo variará según el tamaño de la pantalla.
Si no es necesario que la imagen cubra toda el área, se puede utilizar la opción Imagen completa en las opciones de visualización de imágenes (consulte la sección de este artículo: Configuración de la imagen de fondo).
Los fondos de vídeo actualmente no tienen una opción de vídeo completo. Ajustar la relación de aspecto del vídeo original podría solucionarlo.
Para obtener más información sobre la relación de aspecto, consulte Medios: pautas y especificaciones.
El vídeo no se muestra
Si el vídeo se añade mediante un enlace, el problema podría estar relacionado con los ajustes de privacidad del vídeo. Para comprobarlo, prueba con otro enlace. Si el nuevo vídeo funciona, significa que los ajustes de privacidad del vídeo original impiden que se muestre en el sitio.
La solución dependerá de la plataforma que aloje el vídeo, y su equipo de asistencia podrá ayudarle.