Ir al contenido principal

Cambiar los estilos de sección de tu sitio web

Ajusta el diseño, los colores, el medio de fondo, el texto, el espaciado y más para cada sección usando el editor de estilos.

Mark De Paola avatar
Escrito por Mark De Paola
Actualizado hoy

Los estilos de sección te dan control total sobre la apariencia de cada sección en tu sitio.Ya sea que estés diseñando una página de destino limpia o un bloque promocional audaz, puedes ajustar cada detalle, desde los colores y el diseño hasta las animaciones y los bordes, todo dentro del editor de secciones.

Para cambiar el estilo de una sección:

  1. Abre tu sitio en el Editor.

  2. Pasa el cursor sobre la sección que deseas editar.

  3. Haz clic en el icono de edición en la esquina superior derecha de la sección.

  4. En el panel que se abre a la derecha, haz clic en la pestaña Estilo (icono de cubo de pintura) en la parte superior.

  5. Utilice las opciones disponibles para ajustar el diseño y el estilo visual.Todos los cambios se aplican instantáneamente.

Consejo útil:

Haz clic en el icono de captura para mover el editor de secciones entre los lados izquierdo y derecho de tu pantalla.

Colores

  • Selecciona entre los colores del tema de la página – Aplica una de las combinaciones de colores predefinidas de tu sitio.

  • Utilice fondos sólidos o degradados – Elija entre un color plano o un relleno degradado.

  • Anular con colores personalizados – Defina manualmente los colores de fondo y acento para la sección.

Imagen o video de fondo

  • Haga clic en Agregar medios para abrir el selector de medios.

  • Elija de la biblioteca de medios de Durable o cargue una imagen (JPG, JPEG, PNG de hasta 32MB). Las cargas de video no son compatibles.

  • Haz clic en Deja que la IA elija por ti para generar una imagen automáticamente.

  • Después de seleccionar los medios, aparecen controles adicionales:

    • Regenerar – Reemplazar la imagen generada por IA.

    • Cambiar – Seleccione nuevos medios manualmente.

  • Refina la apariencia con:

    • Posición – Ajustar la colocación horizontal y vertical de la imagen.

    • Superposición – Controla cuán visible es la imagen o el video.

    • Desenfoque – Agregar un efecto de desenfoque suave.

Opciones de texto

  • Tamaño del encabezado – Elija entre Pequeño, Mediano, Grande o Extra Grande.

  • Tamaño del subtítulo – Elija entre Pequeño, Mediano o Grande.

  • Alineación de texto – Alinee el contenido a la izquierda, al centro o a la derecha utilizando los íconos de alineación.

Diseño y Estilo Avanzado

  • Esquinas redondeadas – Elige Pequeño, Mediano, Grande, Ninguno, o que coincida con el tema de la página de tu sitio.

  • Animaciones – Controla cómo aparecen los elementos cuando se carga la sección:

    • Las opciones incluyen: Ninguna, Desvanecer, Acercar, Alejar, Deslizar hacia arriba, Deslizar hacia la izquierda, Deslizar hacia la derecha, o hacer coincidir el tema de la página.

  • Espaciado – Controlar el espacio alrededor de la sección:

    • Espaciado superior – Ninguno, Pequeño, Medio o Grande

    • Espaciado inferior – Ninguno, Pequeño, Mediano o Grande

  • Altura mínima – Establece la altura mínima de la sección:

    • Contenido – Ajusta la altura al contenido interno.

    • Pantalla – Llena la pantalla del visitante con la sección.

      • Si se selecciona Pantalla, elija la alineación vertical: Superior, Medio o Inferior.

Divisores y Bordes

  • Divisor – Añade un divisor visual entre esta sección y la siguiente. Cuando está habilitado, haz clic en el ejemplo para elegir un estilo.

  • Borde – Agrega un borde que coincida con la dirección del divisor:

    • Seleccione color, grosor y tipo (Sólido o Discontinuo).

Cuando hayas terminado de personalizar tu sección, haz clic en Listo en la esquina superior derecha del panel para guardar tus cambios.

Si necesita ayuda para diseñar secciones destacadas o necesita orientación sobre las mejores prácticas, nuestro equipo siempre está dispuesto a ayudar.¡Solo comunícate!

¿Ha quedado contestada tu pregunta?