Imagen

---

Texto

Color del texto – Elige entre color de texto oscuro o claro.

Sombra del texto – Aplica una sombra al texto.

Nota: La opción de texto solo se aplica si usas el diseño en cuadrícula.

Texto del título

Fuente del título – Elige la fuente que quieres usar para el texto del título. La fuente predeterminada se selecciona automáticamente; sin embargo, puedes elegir otra fuente o subir una fuente personalizada haciendo clic en el menú desplegable.

Grosor de la fuente del título – Haz clic en el menú desplegable para seleccionar el grosor de la fuente del texto del título.

Estilo de la fuente del título – Elige el estilo de la fuente del texto del título:

• Cursiva

• Mayúsculas

• Versales pequeñas

• Subrayado

• Tachado

Alineación del texto del título – Elige la alineación del texto solo para el título:

• Izquierda

• Centro

• Derecha

• Justificado

Color del texto del título – Elige un color específico para el texto del título. Selecciona desde la paleta de colores de tu sitio o usa el icono cuentagotas para elegir un color nuevo.

Tamaño del texto del título – Elige el tamaño de la fuente del texto del título arrastrando el deslizador o escribiendo un valor numérico.

Espaciado entre letras del título – Elige el espaciado entre letras del texto del título arrastrando el deslizador o escribiendo un valor numérico. El espaciado entre letras es el espacio entre cada letra. Cuanto mayor sea el número, más espacio habrá.

Altura de línea del título – Elige la altura de línea del texto del título arrastrando el deslizador o escribiendo un valor numérico. La altura de línea es el espacio entre cada línea de texto. Cuanto mayor sea el número, más espacio habrá.

Sombra del texto del título – Añade una sombra al texto del título. Una vez seleccionado el estilo, puedes configurar la dirección de la sombra (horizontal y vertical), la intensidad del desenfoque y el color de la sombra.

Nota: La opción de texto del título solo se aplica si usas el diseño en cuadrícula.

Texto del pie de foto

Grosor de la fuente del pie de foto – Haz clic en el menú desplegable para seleccionar el grosor de la fuente del texto del pie de foto.

Estilo de la fuente del pie de foto – Elige el estilo de la fuente del texto del pie de foto:

• Cursiva

• Mayúsculas

• Versales pequeñas

• Subrayado

• Tachado

Alineación del texto del pie de foto – Elige la alineación del texto solo para el pie de foto:

• Izquierda

• Centro

• Derecha

• Justificado

Color del texto del pie de foto – Elige un color específico para el texto del pie de foto. Selecciona desde la paleta de colores de tu sitio o usa el icono cuentagotas para elegir un color nuevo.

Tamaño del texto del pie de foto – Elige el tamaño de la fuente del texto del pie de foto arrastrando el deslizador o escribiendo un valor numérico.

Espaciado entre letras del pie de foto – Elige el espaciado entre letras del texto del pie de foto arrastrando el deslizador o escribiendo un valor numérico.

Altura de línea del pie de foto – Elige la altura de línea del texto del pie de foto arrastrando el deslizador o escribiendo un valor numérico.

Sombra del texto del pie de foto – Añade una sombra al texto del pie de foto. Puedes configurar dirección, intensidad y color.

Nota: La opción de texto del pie de foto solo se aplica si usas el diseño en cuadrícula.

Texto de paginación

Grosor de la fuente de la paginación – Haz clic en el menú desplegable para seleccionar el grosor de la fuente del texto de la paginación.

Estilo de la fuente de la paginación – Elige el estilo de la fuente del texto de la paginación:

• Cursiva

• Mayúsculas

• Versales pequeñas

• Subrayado

• Tachado

Alineación del texto de paginación – Elige la alineación del texto solo para la paginación:

• Izquierda

• Centro

• Derecha

• Justificado

Color del texto de paginación – Elige un color específico para el texto de la paginación. Selecciona desde la paleta de colores de tu sitio o usa el icono cuentagotas para elegir un color nuevo.

Tamaño del texto de paginación – Elige el tamaño de la fuente del texto de la paginación arrastrando el deslizador o escribiendo un valor numérico.

Espaciado entre letras de paginación – Elige el espaciado entre letras del texto de la paginación arrastrando el deslizador o escribiendo un valor numérico.

Altura de línea de paginación – Elige la altura de línea del texto de la paginación arrastrando el deslizador o escribiendo un valor numérico.

Sombra del texto de paginación – Añade una sombra al texto de la paginación. Puedes configurar dirección, intensidad y color.

Nota: La opción de texto de paginación solo se aplica si usas el diseño en cuadrícula.

Dimensiones

Ancho máximo – Define el ancho máximo del módulo. Para más información, consulta la documentación oficial.

Alineación del módulo – Si defines un valor de ancho o ancho máximo, puedes alinear el módulo con las tres opciones:

• Alineado a la izquierda

• Alineado al centro

• Alineado a la derecha

Altura mínima – Define el valor mínimo para la altura del módulo. Para más información, consulta la documentación oficial.

Altura – Define la altura del módulo. Para más información, consulta la documentación oficial.

Altura máxima – Define la altura máxima que el módulo puede tener. Para más información, consulta la documentación oficial.

Espaciado

• El margen añade espacio fuera del módulo, y el relleno añade espacio dentro del módulo.

• Para mantener proporciones iguales entre valores (por ejemplo, arriba y abajo), haz clic en el ícono de cadena entre los valores para enlazarlos.

Los valores predeterminados de margen para el módulo son 0.
Los valores predeterminados de relleno para el módulo son 0.

Borde

• Esquinas redondeadas – Escribe un valor numérico para redondear las esquinas. Cuanto mayor sea el número, más redondeadas serán las esquinas. Los valores de las esquinas están enlazados automáticamente (lo indica el icono de cadena azul). Para establecer valores diferentes en cada esquina, haz clic en la cadena para desvincularlos.

• Estilos de borde – Añade borde en todos los lados o individualmente (arriba, derecha, abajo, izquierda).

• Ancho del borde – Define el ancho del borde. Para un borde más grueso, aumenta el número. El ancho debe ser al menos 1px para mostrarse.

• Color del borde – Elige el color del borde desde la paleta de colores predeterminada o usa el cuentagotas para elegir un nuevo color.

• Estilo de borde – Elige el estilo de borde: sólido, discontinuo, punteado, doble, ranura, cresta, incrustado, sobresaliente o ninguno.

Sombra de caja

• Posición horizontal de la sombra – Define la posición horizontal de la sombra.

• Posición vertical de la sombra – Define la posición vertical de la sombra.

• Intensidad del desenfoque – Define cuánto se difumina la sombra. A mayor valor, más grande y difusa será la sombra.

• Intensidad de la expansión – Define cuán densa es la sombra. A mayor valor, la sombra se hace más intensa.

• Color de la sombra – Define el color de la sombra.

• Posición de la sombra – Define si la sombra está dentro o fuera del módulo.

Filtros
Ajusta los filtros del módulo:

• Tono – Define el ángulo del color.

• Saturación – Define la intensidad del color.

• Brillo – Define qué tan brillante es el color.

• Contraste – Define qué tan marcadas son las áreas claras y oscuras.

• Invertir – Invierte tono, saturación y brillo según el valor dado.

• Sepia – Da un tono más cálido, amarillento/marrón.

• Opacidad – Define qué tan transparente u opaco es el fondo (color, degradado, imagen, etc.).

• Desenfoque – Define la cantidad de desenfoque gaussiano aplicado al módulo.

El modo de fusión define cómo se mezcla el módulo con las capas debajo. Por defecto está en normal.

Transformar
Opciones para transformar:

• Escalar

• Trasladar

• Rotar

• Sesgar

• Puntos de origen

Puedes navegar entre opciones con tabulador. Se configuran con valores numéricos o arrastrando cajas o círculos.

Para mantener valores iguales, haz clic en el icono de cadena abajo a la derecha.

Animación

• Duración de la animación – Tiempo que tarda en completarse un ciclo.

• Retraso de la animación – Tiempo que espera antes de empezar la animación. Puede empezar después, inmediatamente o parcialmente.

• Opacidad inicial – Define el valor inicial de opacidad.

• Curva de velocidad – Define el método de aceleración y desaceleración para un efecto más suave.

• Repetición de animación – Por defecto la animación se reproduce una vez. Para que se repita continuamente, elige la opción de bucle.
  

Pestaña Avanzada

La pestaña Avanzada contiene opciones que pueden ser útiles para diseñadores web con más experiencia, como CSS personalizado.

Aquí, puedes aplicar CSS personalizado a tu módulo. También puedes asignar clases e IDs CSS personalizadas al módulo, las cuales pueden usarse para personalizar los estilos del módulo con propiedades CSS más avanzadas o para aplicar código CSS personalizado usando la clase CSS del módulo.

---

ID y Clases CSS
Asigna un ID o clase CSS específica a este módulo. Esto es útil al aplicar CSS personalizado a un módulo utilizando la hoja de estilos de tu tema hijo.

---

CSS Personalizado
CSS Libre - Escribe CSS libre usando el selector keyword para apuntar a este módulo. Ejemplo:
selector {color: red;}

---

Elementos del Módulo
También puedes aplicar CSS personalizado a este módulo pegándolo en esta pestaña. Al hacer clic en la pestaña Elementos del Módulo, verás secciones individuales donde puedes añadir propiedades CSS personalizadas.

---

Condiciones

Las Condiciones de Visualización te permiten elegir cuándo mostrar este módulo basado en un conjunto de condiciones, como por ejemplo, cuando un usuario está visitando la página, si ya ha comprado anteriormente en tu empresa, qué navegador está usando, qué sistema operativo usa, y más.

Puedes añadir una o varias condiciones.

---

Visibilidad

Deshabilitar en - Define la visibilidad del módulo. Puedes deshabilitarlo (ocultarlo) cuando la ventana de visualización sea un Teléfono, Tableta o Escritorio marcando la casilla correspondiente.

Desbordamiento Horizontal - Define qué se muestra cuando el contenido sobrepasa los bordes izquierdo y derecho de un elemento de bloque. Puede ser:

• Visible - El contenido se mostrará si sobrepasa la altura del módulo.

• Desplazar - Si el contenido sobrepasa la altura del módulo, se usará una barra de desplazamiento vertical para recorrer el contenido.

• Oculto - Si el contenido sobrepasa la altura, la parte que sobresalga quedará oculta.

• Automático - El navegador decide si se muestra una barra de desplazamiento.

Desbordamiento Vertical - Define qué se muestra cuando el contenido sobrepasa los bordes superior e inferior de un elemento de bloque. Opciones iguales a las del desbordamiento horizontal.

---

Transiciones

Esto controla la duración de la transición, el retardo y la curva de velocidad de la animación al pasar el cursor.

• Duración de la transición - Define la duración (en milisegundos) de la transición de la animación al pasar el cursor.

• Retardo de transición - Define el retardo de la transición (en milisegundos).

• Curva de velocidad de transición - Define la curva de velocidad de la transición.
  

Posición

Define la posición del módulo:

• Relativa (valor por defecto) - El módulo se posiciona según el flujo normal del documento, y los valores de desplazamiento son relativos a sí mismo basados en los valores de Desplazamiento Vertical y Horizontal. El desplazamiento no afecta la posición de otros elementos, por lo que el espacio asignado en el diseño es igual a si la posición fuera estática.

• Absoluta - El módulo se elimina del flujo normal del documento, no dejando espacio en el diseño. Se posiciona relativo a su antecesor posicionado más cercano o al bloque contenedor inicial. Las opciones de ubicación determinan su posición final.

• Fija - El módulo se elimina del flujo normal y no deja espacio. Se posiciona en relación con la ventana del navegador. Esto puede usarse para crear un módulo fijo o sticky.

• Desplazamiento Vertical - Define la posición vertical del módulo.

• Desplazamiento Horizontal - Define la posición horizontal del módulo.

• Índice Z - Define el orden del módulo en el diseño. Los módulos con índice Z más alto se superponen a los de índice Z más bajo.
  

Efectos de Desplazamiento

Esta sección define el comportamiento del módulo cuando el usuario desplaza la página. Puedes hacer que el módulo se quede fijo en la parte superior, inferior o en ambos lados, y decidir si el módulo debe transformarse mientras el usuario desplaza.

También puedes activar movimiento vertical para ajustar la velocidad de desplazamiento del elemento sin afectar los elementos circundantes.

La función de Activación del Efecto de Movimiento te permite elegir cuándo se activa el efecto de desplazamiento: cuando la parte superior, media o inferior del elemento está visible.

---

Guardar y Salir

Una vez termines de diseñar y configurar el módulo contador, haz clic en la flecha verde en la parte inferior derecha del módulo para guardar tu diseño. Si cierras el módulo sin guardar, se perderán los cambios.

---

Guardar el Diseño de la Página

Para guardar el diseño de la página, puedes usar CMD + S en Mac o CTRL + S en PC. También puedes usar la barra de herramientas inferior de Divi, haciendo clic en el icono de puntos suspensivos púrpura y luego en el botón verde de Guardar en la parte inferior derecha.

---

Salir del Constructor Visual

Ahora que todos tus cambios están guardados, haz clic en Salir del Constructor Visual en la barra de administración superior para salir del Constructor Visual.