Los contenedores y fondos en OZ CMS son elementos clave para estructurar cada página, definir áreas diferenciadas y aplicar estilos consistentes en todo tu sitio. Con ellos puedes dividir secciones, combinar colores, imágenes o videos de fondo y añadir efectos visuales que mantienen la coherencia del diseño.
A continuación, se explica cómo funcionan, cómo se añaden y cuáles son sus principales opciones de ajuste paso a paso.
¿Qué son los contenedores?
Los contenedores son los bloques estructurales que organizan la disposición de todo el contenido dentro de una página. Dentro de cada contenedor puedes crear filas y dentro de las filas, columnas (hasta cinco por fila). Cada columna puede contener widgets como texto, imágenes, botones, formularios o cualquier otro elemento disponible.
El uso de contenedores te permite:
Dividir visualmente las secciones.
Aplicar estilos de fondo diferentes por bloque.
Ajustar márgenes y espaciados de forma precisa.
Cómo añadir un contenedor
Abre el editor visual de tu sitio en OZ CMS.
Haz clic en Agregar bloque en la posición deseada.
Selecciona un diseño predefinido o añade un bloque en blanco.
Dentro de ese bloque se crea automáticamente un contenedor. Puedes subdividirlo en filas y columnas según la estructura que necesites.
Ajustes básicos de contenedores
División de filas y columnas: Puedes organizar el contenido dividiendo el contenedor en varias filas y cada fila en hasta cinco columnas.
Ajuste de tamaño: Las columnas se pueden redimensionar arrastrando los controles de anchura.
Espaciado: Usa las opciones de padding para crear márgenes internos que separen elementos dentro de un mismo contenedor.
Fondos de contenedor: tipos y configuración
Cada contenedor permite asignar un fondo para diferenciar secciones o destacar contenido. Los tipos de fondo son:
1. Color sólido:
Puedes aplicar un color de fondo uniforme usando el selector de color HEX. También es posible ajustar el nivel de transparencia.
2. Imagen de fondo:
Sube una imagen en formato PNG, JPG, GIF o GIF animado.
Configura la posición (superior, izquierda o derecha).
Decide si la imagen se repite, no se repite o cubre todo el contenedor.
Agrega una superposición de color sólida o degradada con nivel de opacidad para mejorar la legibilidad del texto.
3. Video de fondo:
Inserta un enlace de YouTube.
Decide si el video tendrá audio.
Define si debe reproducirse en bucle y desde qué segundo inicia y termina.
Cada fondo se puede personalizar para que combine con la paleta global de tu sitio.
Fondos por columna
Además de los fondos del contenedor principal, cada columna dentro de un contenedor puede tener su propio fondo independiente. Puedes aplicar:
Fondo de color.
Fondo de imagen.
Fondo con degradado y nivel de transparencia.
Esto permite crear composiciones visuales más dinámicas combinando capas de fondo.
Divisores de forma
Los contenedores incluyen divisores de forma para separar visualmente secciones. Puedes elegir entre diecinueve opciones prediseñadas (curvas, triángulos, ondas, pinceladas, nubes, entre otros).
Ubicación: parte superior o inferior del contenedor.
Inversión: los divisores se pueden voltear para ajustarse a la dirección del diseño.
Uso combinado: puedes aplicar diferentes divisores a varios contenedores para marcar transiciones.
Puntos de anclaje
Cada contenedor permite añadir puntos de anclaje, útiles para crear menús de navegación interna o enlaces directos a secciones específicas de una misma página.
Cómo aplicar y modificar contenedores y fondos
Selecciona el contenedor o columna que quieres editar.
Accede al menú de estilo desde el panel lateral.
Define el tipo de fondo: color, imagen o video.
Ajusta superposiciones, transparencias y posición de la imagen.
Aplica divisores de forma y configura su ubicación.
Guarda los cambios para verlos reflejados de inmediato en la página.
Resumen de beneficios operativos
Organiza el contenido de forma clara y modular.
Aplica estilos visuales consistentes con la paleta global.
Combina colores, imágenes y videos para destacar secciones clave.
Usa puntos de anclaje para facilitar la navegación interna.
Controla cada ajuste de forma visual sin usar código.
Conclusión
El uso correcto de contenedores y fondos en OZ CMS permite diseñar páginas estructuradas, atractivas y coherentes con la identidad de marca. Todo se gestiona desde el editor visual, sin dependencias externas ni necesidad de conocimientos técnicos.