Ajustes de diseño y avanzados

Cada vez que edite un módulo, fila o sección, verá tres pestañas en la ventana modal de ajustes: Contenido, Diseño y Avanzado. En la pestaña Contenido podrá encontrar todo lo que necesita para crear sensacionales diseños en Divi y para aprovechar cada módulo. Sin embargo, si desea tener más control sobre la apariencia del módulo, podrá aventurarse a la pestaña Diseño. Si usted es un desarrollador y quiere usar su propio código CSS en lugar de los controles de diseño avanzado, podrá ir directamente a la pestaña Avanzado. Al usarlos combinados, no hay nada que no se pueda diseñar a gusto.

Ajustes de Diseño

Los ajustes de diseño varían de módulo a módulo. Para cada uno, hemos añadido todos los posibles ajustes de diseño que pueda necesitar en la pestaña Ajustes de diseño avanzado, y hemos dejado todos los ajustes de diseño básicos o usados más comúnmente en la pestaña Ajustes generales. Como regla general, si hay algo que no puede hacer a nivel diseño desde la pestaña Ajustes generales, sin dudas podrá lograrlo desde la pestaña Ajustes de diseño avanzado. Debido al enorme abanico de ajustes disponibles en determinados módulos, los hemos separado en su propia pestaña, así los ajustes generales no quedan saturados.

Para localizar y usar los ajustes Diseño, simplemente edite un módulo, una fila o una sección existentes (o cree uno/a nuevo/a) y se abrirá la ventana modal de los ajustes. Luego haga clic en la pestaña Diseño para revelar los controles de diseño.

Desde esta pestaña puede hacer casi cualquier cosa. Los ajustes variarán de acuerdo con el tipo de módulo que esté editando. Por lo general, encontrará opciones para ajustar la tipografía (como tamaño del texto, espacio entre letras, altura de línea, etc.), así como también un montón de ajustes únicos para ciertos elementos. Al usar estas opciones de diseño, podrá crear páginas realmente atractivas y originales, que no serían posibles solo con los Ajustes generales.

Avanzado

En la pestaña Diseño hemos incluido muchísimas opciones con las cuales podrá modificar casi cualquier aspecto, tal como lo haría con CSS, pero sin tocar ni una línea de código. Sin embargo, si usted es un desarrollador quizá prefiera escribir su propio código en lugar de usar los controles de diseño personalizado integrados. En este caso puede usar la tercera pestaña de la ventana modal de los ajustes para módulos, filas y secciones: Avanzado.

En esta pestaña puede añadir una ID o Clase CSS personalizada para poder aplicar estilos propios en el archivo style.css del tema hijo.

Si prefiere algo más simple, sin necesidad de usar un tema hijo, puede aplicar los estilos directamente en los elementos de los módulos desde la opción CSS personalizado. Aquí hemos desdoblado los elementos estructurales del módulo, e incluimos varios campos de texto donde podrá escribir su propio código CSS. Al usar este panel, podrá aplicar CSS a partes individuales del módulo. Por ejemplo, puede aplicar CSS personalizado directamente a un icono de Anuncio breve, o crear su propio seudoelemento :after desde el constructor de Divi.

Finalmente, en el panel Visibilidad, podrá ajustar la visibilidad del módulo en teléfonos, tablets y equipos de escritorio.