TUTORIALES DIVI

Ajustes de diseño y tipografía

Ajustar el diseño y la tipografía del sitio

Para empezar a personalizar el diseño y la tipografía de su sitio, primero debe ingresar al Personalizador de tema, con un clic en el enlace Divi > Personalizador de tema del menú de WordPress. Esto abrirá el personalizador. Luego busque el panel Ajustes generales. Haga clic en el panel para abrir los ajustes correspondientes y comience a personalizarlos.

Dentro del panel Ajustes generales, verá cuatro secciones: Identidad del sitio (opción nativa de WordPress), Ajustes de diseño, Tipografía y Fondo.

Ajustes de diseño

En este panel podrá ajustar varias opciones de tamaño y espaciado para su sitio. Aquí puede aumentar o disminuir el espacio entre columnas, filas y secciones, y modificar el tamaño de la barra lateral. También puede activar el diseño con recuadro desde este panel.

  • Activar diseño con recuadro – Aquí puede cambiar el diseño del sitio, mostrando un recuadro que enmarca el contenido y expone el fondo que podrá ser personalizado.
  • Ancho del contenido del sitio – Aquí es donde se puede asignar el ancho máximo de la sección del contenido. Como el contenido está basado en un diseño adaptable, se ajustará a tamaños menores de pantalla pero no se expandirá más allá del ancho máximo que se configure aquí.
    El ancho predeterminado es de 1080px. Esta es una buena medida para la mayoría de los equipos de escritorio y laptops.
  • Ancho de separación del sitio – El ancho de separación corresponde a la cantidad de espacio horizontal (margen) entre las columnas de cada fila. Los valores opcionales del ancho de separación van de 1 a 4. 1 representa un margen cero entre columnas. 2 representa un 3% de margen derecho entre columnas. 3 representa un 5.5% de margen derecho entre columnas. 4 representa un 8% de margen derecho entre columnas.
  • Usar ancho personalizado de barra lateral – Esto asigna el ancho predeterminado de la barra lateral para el tema. Aplica para todas las páginas que tengan una barra lateral y no hayan sido creadas con el constructor.
  • Altura de sección – Esta opción ajusta la cantidad de espacio vertical (relleno superior e inferior) de cada sección.
  • Altura de fila – Esta opción ajusta la cantidad de espacio vertical (relleno superior e inferior) de cada fila.
  • Color de acento del tema – Antes de que empiece a cambiar los colores de los demás elementos, debería cambiar esto primero. Una vez que lo cambie, guarde y publique los ajustes y recargue la página. Ahora el color de acento del tema se habrá propagado automáticamente en otros elementos.

Tipografía

En el panel Tipografía podrá ajustar la apariencia predeterminada del texto en todo el sitio. Puede seleccionar el tamaño de las fuentes del texto y de los títulos, que se verán reflejados por igual en todas las áreas del sitio. También puede seleccionar los colores, así como la altura de línea, el espacio entre letras y los estilos de fuente. Por último, también podrá elegir entre docenas de fuentes para aplicar a cada opción.

  • Tamaño de textos – Esto cambia el texto predeterminado del tema. El tamaño predeterminado es de 14px.
  • Altura de línea de textos – La altura de cada línea individual de texto.
  • Tamaño de texto del título – Divi le permite asignar un tamaño de texto para los encabezados aquí. Esto afecta elementos como los títulos del módulo Encabezado de ancho completo.
  • Espacio entre letras del encabezado – El espacio entre letras ajusta la distancia horizontal entre caracteres. Este valor afecta a todos los niveles de encabezados  (h1, h2, h3, h4, h5, h6), los bloques de citas y los títulos de las diapositivas.
  • Altura de línea del encabezado – Al igual que el valor de espacio entre letras, la altura de línea afecta a todos los niveles de encabezados  (h1, h2, h3, h4, h5, h6), los bloques de citas y los títulos de las diapositivas. Por el tamaño mayor de fuente, el valor predeterminado es 1em.
  • Estilo de fuente del encabezado – Use estas opciones para cambiar el estilo de fuente de los títulos.
  • Fuente de títulos – La fuente predeterminada de Divi es Open Sans, pero el personalizador de tema contiene casi cien fuentes de las cuales puede elegir. Aproveche estas fuentes incluidas y pruebe cuáles funcionan mejor con su diseño.
  • Fuente de textos – La fuente predeterminada de Divi es Open Sans, pero el personalizador de tema contiene casi cien fuentes de las cuales puede elegir. Aproveche estas fuentes incluidas y pruebe cuáles funcionan mejor con su diseño.
  • Color de enlace de textos – El color de enlace de textos es heredado del color de acento del tema. Pero puede cambiarlo aquí.
  • Color de textos – Aquí puede cambiar el color de los textos del tema.
  • Color de texto del título – Aquí puede cambiar el color de los títulos del tema.

Fondo

El panel Fondo le permite seleccionar el color de fondo del tema, así como también subir una imagen personalizada para usar como fondo, y ajustar la posición en la página. Las imágenes y colores de fondo dan muy buenos resultados cuando se usa el diseño con recuadro mencionado en la sección anterior.

Cómo obtener ayuda

No dude en ponerse en contacto con nosotros en Soporte si necesita ayuda.