Personaliza el fondo de los elementos para que coincida con la temática de tu negocio con diseños llamativos y creativos. Elija entre imágenes de fondo personalizadas en la galería de fotos, cargue sus propias imágenes, use fondos de video o aplique colores y degradados para agregar un toque único a su sitio.
Nota
Para fondos de página, consulte Fondo del tema.
Cualquier archivo (texto, imagen, video, audio) que se cargue en el sistema estará disponible de forma pública. No se deberá cargar información personal ni confidencial. Para eliminar el archivo por completo, elimine el archivo desde el Administrador de medios.
Para obtener detalles sobre las pautas de los medios, consulte Medios: pautas y especificaciones.
Recomendación
Todos los videos de fondo de YouTube muestran el título y la herramienta de carga del video antes de que el video comience a cargarse. No hay forma de eliminar estos elementos sin cambiar el CSS de forma manual. Debido a este cambio, no se recomienda utilizar videos de YouTube para los videos de fondo.
Para editar el fondo de los elementos:
-
Vaya a la sección Antecedentes .
-
Dependiendo del elemento, seleccione Color, Imagen o Video y seleccione el fondo deseado.
-
Algunos elementos también tienen la opción de controles deslizantes de imágenes. Para crear un control deslizante de imágenes, seleccione varias imágenes y luego haga clic en Listo. Para obtener información detallada sobre los controles deslizantes de fondo, consulte Controles deslizantes de imágenes de fondo.
-
Para obtener 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 emplea una sola imagen (esta configuración aparecerá después de que se seleccionó una imagen).
Algunos contenedores ofrecen la opción de agregar un control deslizante de imagen de fondo.
Para crear un control deslizante de fondo:
-
Vaya a la sección Antecedentes .
-
Haga clic en la imagen.
-
Haga clic en el signo + y seleccione varias imágenes en lugar de una sola imagen en el selector de imágenes.
-
Haga clic en Listo.
-
(Opcional) Una vez creado el control deslizante, puede establecer configuraciones de diapositiva, como el estilo de transición de diapositiva y la velocidad de diapositiva desde el menú de diseño de fila.
-
(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.
Una vez que se configuró 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 formas en que puede controlar cómo se muestran las imágenes dentro del contenedor. Estas opciones le permiten ajustar cómo una imagen se ajusta, se repite o se estira 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. Si bien la imagen no se cortará, es posible que aparezcan barras a los lados o encima y debajo de la imagen, según el tamaño del contenedor.
-
Mosaico: repite la imagen completa en su tamaño original en un patrón de mosaico para llenar el área. Si la imagen es más grande que el contenedor, no se repetirá.
-
Sin repetir: 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ño 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. La configuración de posición funciona junto con las opciones de visualización de la imagen para controlar cómo se muestra la imagen.
-
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.
-
Emplea los fondos de video para agregar rápidamente un video de YouTube, Vimeo o Dailymotion. Los fondos de video pueden llamar la atención de un visitante con contenido en movimiento y agregar un aspecto moderno y elegante a cualquier sitio.
Recomendación
Todos los videos de fondo de YouTube muestran el título y la herramienta de carga del video antes de que el video comience a cargarse. No hay forma de eliminar estos elementos sin cambiar el CSS de forma manual. Debido a este cambio, no se recomienda utilizar videos de YouTube para los videos de fondo.
Para agregar un fondo de video a un contenedor:
-
Tenga un video listo para cargar o la URL para compartir de un video que esté cargado en YouTube, Vimeo o Dailymotion.
-
Haga clic con el botón derecho en el elemento al que desea agregar este fondo y, a continuación, haga clic en Editar diseño.
-
Vaya a la sección Antecedentes .
-
Haga clic en la pestaña Video . Tienes las siguientes opciones:
-
Haga clic en Cargar video y seleccione el video que desea cargar. Puedes cargar hasta 200 MB en todos los formatos. Puede cargar videos desde su dispositivo, Facebook, Instagram, Dropbox, Google Drive o grabar un video con su cámara sitio web.
-
Pegue el URL del video que desea usar en el cuadro de texto del URL de YouTube, Vimeo o Dailymotion.
Nota
Los videos de YouTube no son compatibles con dispositivos móviles, ya que no se reproducen de forma automática en dispositivos iOS.
-
-
Los videos de YouTube no son compatibles con dispositivos móviles, ya que no se reproducen de forma automática en dispositivos iOS.
-
Los iPhone con batería en modo de baja potencia no reproducen automáticamente videos en un sitio y, en su lugar, mostrarán un botón de reproducción.
-
Los videos de fondo no reproducirán sonidos.
-
Los videos pueden tomar tiempo y ancho de banda para cargar y pueden distraer a los usuarios de enlaces o texto importantes de su página, así que úselos con moderación.
-
Considere agregar una superposición con una mayor opacidad del fondo del video para hacer que el efecto sea más sutil.
-
Cuando agregue un video de Dailymotion que forma parte de una lista de reproducción, asegúrese de agregar solo el enlace directo al video (y omita el parámetro de la lista de reproducción, que se parece a esto:?playlist=x1x2f3). Si el URL del video tiene este parámetro, bórrelo. Por ejemplo: https://www.dailymotion.com/video/x60ktex?playlist=x5x6f2 sería https://www.dailymotion.com/video/x60ktex
Esto se debe a que la relación de aspecto de la imagen o el video es diferente a la del contenedor.
Dependiendo de cuál sea su objetivo, abordar esto puede resultar un desafío. Si la imagen o el video deben ajustar a un contenedor que cambia según el tamaño de la pantalla, no existe una solución perfecta para evitar que se corten. La parte visible de la imagen o el video variará según el tamaño de la pantalla.
Si no es necesario que la imagen cubra toda el área, se puede emplear 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 video actualmente no tienen una opción de video completa. Ajustar la relación de aspecto del video original puede solucionar el problema.
Para obtener más información sobre la relación de aspecto, consulte Relación de aspecto frente a resolución.
Si el video se agrega a través de un enlace, el problema podría estar relacionado con la configuración de privacidad del video. Para comprobarlo, prueba a emplear un enlace de video diferente. Si el nuevo video funciona, sugiere que la configuración de privacidad del video original impide que se muestre en el sitio.
La solución dependerá de la plataforma que aloje el video, y su equipo de soporte podrá ayudarlo.