Configuraciones de Diseño de Divi y Configuraciones Avanzadas del Módulo

Configuraciones de Diseño de Divi y Configuraciones Avanzadas del Módulo

Configuraciones de Diseño de Divi y Configuraciones Avanzadas del Módulo

Puedes personalizar absolutamente todo sobre cualquier módulo utilizando las configuraciones avanzadas de diseño.


Siempre que edites un Módulo, Fila o Sección, notarás que en la ventana emergente de configuración hay tres pestañas:

  • Pestaña Contenido

  • Pestaña Diseño

  • Pestaña Avanzado


Pestaña Contenido

Todo lo que necesitas para crear increíbles diseños en Divi y aprovechar al máximo cada módulo se encuentra en la pestaña Contenido.

Sin embargo, si deseas tener aún más control sobre la apariencia del módulo, puedes ir a la pestaña Diseño. Si eres desarrollador y prefieres usar tu propio código CSS en lugar de los controles de diseño que ofrece la pestaña  Diseño, puedes ir aún más allá entrando en la pestaña Avanzado.Cuando se usan juntas, no hay nada que no se pueda personalizar.

Pestaña Diseño

Las configuraciones de diseño varían de un módulo a otro.

Hemos incorporado todas las opciones de diseño posibles que podrías necesitar dentro de la pestaña Diseño.

Debido a la gran cantidad de configuraciones disponibles en ciertos módulos, estas se han organizado en menús desplegables con etiquetas, lo que permite alternar fácilmente entre los distintos grupos de opciones.

También encontrarás un cuadro de búsqueda muy práctico en la parte superior, que facilita encontrar rápidamente una opción de diseño específica.

Para localizar y utilizar las configuraciones de diseño: Edita un módulo, fila o sección existente (o crea uno nuevo), se abrirá la ventana emergente de configuración, haz clic en la pestaña Diseño para desplegar todas las opciones de personalización visual.

Desde esta pestaña, puedes hacer prácticamente de todo. Las configuraciones disponibles variarán dependiendo del tipo de módulo que estés editando.
Normalmente encontrarás opciones para ajustar:
  • Tipografía: tamaño del texto, espaciado entre letras, altura de línea, etc.
  • Espaciado: valores personalizados de margen y relleno (padding)
  • Colores: color del texto, color de superposición, colores de fondo de columnas, entre otros
  • Además, encontrarás una gran cantidad de ajustes únicos para elementos específicos según el módulo
Aprovechar todas estas opciones de diseño te permite crear algo verdaderamente único y personalizado.

Pestaña Avanzada

En la pestaña Avanzada, puedes agregar un ID de CSS personalizado o una clase CSS para aplicar tu propio código CSS desde el archivo style.css de tu tema hijo.

Si deseas evitar la necesidad y complicación de crear temas hijos, puedes aplicar CSS directamente a módulos individuales en páginas específicas utilizando las opciones del menú desplegable CSS Personalizado.

Aquí hemos desglosado todos los elementos estructurales del módulo y te ofrecemos campos de texto donde puedes escribir directamente tus propias propiedades CSS.

Puedes aplicar CSS a partes específicas del módulo desde este panel.
Por ejemplo: Aplicar CSS personalizado directamente a un ícono de módulo Blurb, crear un pseudo-elemento ::after directamente desde el Constructor Visual de Divi

También puedes controlar la visibilidad de un elemento (sección, fila, módulo) utilizando la opción Visibilidad, o modificar el comportamiento del elemento, como hacer que sea sticky (pegajoso) en la página, entre muchas otras funciones.

    • Popular Articles

    • Guía de Negocio para Resellers y Partners

      En esta Guía de Negocio vamos a analizar los 8 puntos más importantes a tener en cuenta si te estás planteando lanzar tu Propio Negocio de Apps: ¿Cuánto puedes ganar con un Negocio de Apps? Demo de Scoreapps: Cómo crear Apps y Monetizarlas ¿Qué ...
    • Ver una Demo de Scoreapps para Resellers

      En este vídeo te explicamos el modelo de negocio, los tipos de Apps que puedes crear y las distintas herramientas que incluye Scoreapps en su Plan de Resellers: Y en este otro vídeo te enseñamos cómo funciona el software por dentro:
    • Proporciona acceso a tus Aplicaciones

      Con el Plan Reseller o Plan Partner puedes otorgar fácilmente a tus clientes o colaboradores acceso a tus aplicaciones. Accede a tu Panel de Apps, y después accede a cualquier Aplicación: Una vez dentro del constructor de Apps, ve a Mi Cuenta - ...
    • Cómo Crear una App de Tienda

      El comercio electrónico desde dispositivos móviles se disparó desde comienzos de 2020 debido a la Pandemia del Covid19 y sigue creciendo a tasas del 45% anual. Hoy en día, contar con una App de Tienda resulta imprescindible para cualquier negocio de ...
    • Cómo diseñar la pantalla de inicio o portada de una App

      En el video que te mostramos a continuación te explicamos cómo diseñar la pantalla de inicio de una App:
    • Related Articles

    • Presets Globales de Divi

      Aprende cómo crear presets de Divi y aplicarlos a módulos en todo tu sitio web. <br> Una visión general de la función de presets globales de Divi Un reemplazo poderoso para los valores predeterminados globales Los presets globales de ...
    • El Bloque de Diseño Divi

      El Bloque de Diseño Divi te permite cargar diseños de Divi directamente dentro del editor Gutenberg. El Bloque de Diseño Divi El bloque de diseño Divi es un bloque de Gutenberg que te permite insertar o crear diseños de Divi desde cero directamente ...
    • El módulo de suscripción por correo electrónico de Divi

      Cómo agregar, configurar y personalizar el módulo de suscripción por correo electrónico de Divi <br> El módulo de suscripción por correo electrónico de Divi simplifica el proceso de aumentar tus suscriptores de correo electrónico al ...
    • El sistema de gestión de colores de Divi

      Cómo usar las opciones avanzadas de color de Divi. El sistema de gestión de colores de Divi ha evolucionado a lo largo de los años para convertirse en uno de los sistemas de color más robustos en el universo de WordPress. El sistema de colores de ...
    • Uso de las Opciones de Borde en Divi

      Las opciones de borde de Divi permiten añadir y estilizar fácilmente bordes en cualquier elemento de la página. Con las Opciones de Borde de Divi, es posible crear diseños verdaderamente únicos para tu sitio web. ¡Puedes aplicar bordes personalizados ...