Cómo cambiar el interlineado del texto en WordPress

La espaciación adecuada entre líneas no se trata solo de estética — afecta directamente la legibilidad, la experiencia del usuario e incluso cómo los visitantes interactúan con tu contenido. Ya sea que estés administrando un blog personal o gestionando sitios web comerciales de alto tráfico, optimizar el espaciado del texto en WordPress puede mejorar significativamente la estructura visual de tu sitio.

En esta guía, repasaremos las formas más efectivas de cambiar el espaciado entre líneas en WordPress, con y sin código, usando tanto el editor clásico como el de bloques (Gutenberg). También aprenderás a aplicar CSS personalizado y a solucionar problemas comunes de formato.

Por qué importa el espaciado entre líneas

• Mejora la legibilidad — especialmente en mobile
• Reduce las tasas de rebote al hacer que los textos largos sean más fáciles de escanear
• Mejora la coherencia del diseño entre temas y dispositivos
• Se alinea con las mejores prácticas de SEO (contenido claro y estructurado = mejor interacción)

Vamos a desglosar cómo controlarlo.

Método 1: Ajustar el espaciado entre líneas en el editor Gutenberg

En el editor de bloques predeterminado (Gutenberg), puedes gestionar el espaciado entre líneas usando la configuración del bloque “Paragraph” o mediante clases CSS personalizadas.

➤ Pasos:

• Abre la entrada o página en el editor de WordPress.
• Selecciona un bloque Paragraph.
• En la barra lateral derecha, encuentra la opción Typography > Line height.
• Ajusta el valor (por ejemplo, 1.6, 2, 2.2).

Nota: Si la opción no está disponible, continúa con Custom CSS (Método 3) a continuación.

Método 2: Editor clásico (TinyMCE)

El Classic Editor no incluye una opción directa de line-height. Sin embargo, puedes:

• Usar Shift+Enter para saltos de línea manuales (sin espaciado)
• Usar plugins como TinyMCE Advanced (ahora parte de “Advanced Editor Tools”) para añadir controles de espaciado

Para un estilo coherente, seguimos recomendando establecer line-height mediante CSS.

Método 3: Custom CSS (mejor práctica para control total)

Este método te da control preciso, funciona en todos los bloques y temas, y evita cambios de diseño.

Ejemplo 1: Altura de línea global para todos los párrafos

p {
  line-height: 1.8;
}

Ejemplo 2: Aplicar solo a una clase específica

.custom-text {
  line-height: 2.2;
}

Dónde insertar CSS:

• Appearance → Customize → Additional CSS, o
• Dentro de style.css de tu tema hijo, o
• Mediante un plugin como Simple Custom CSS

Método 4: Page Builders (Elementor, WPBakery, etc.)

Para Elementor:

• Edita la sección o el widget de texto.
• En Style → Typography, ajusta el campo Line Height.
• Puedes configurarlo en em, px o unidades relativas.

Para WPBakery:

• Usa las opciones de diseño o añade CSS personalizado directamente en la configuración de la fila o columna.

Método 5: Espaciado entre líneas adaptable a mobile

• Un buen espaciado entre líneas en desktop puede verse apretado en mobile. La mayoría de los editores (incluidos Gutenberg y Elementor) permiten ajustes responsive. Siempre:
• Previsualiza los cambios en tablet y mobile
• Establece un line-height ligeramente mayor para pantallas pequeñas (por ejemplo, 2 en lugar de 1.6)
•  Problemas comunes y soluciones

¿El line-height no cambia después de actualizar el CSS?

• Asegúrate de que tu tema o plugin no esté sobrescribiendo los estilos.
• Prueba a usar !important en tu regla CSS:

p {
  line-height: 2 !important;
}

¿Los cambios se ven en Customizer pero no en vivo?

• Vacía la caché de tu sitio y la caché del navegador.
• Si usas un plugin de caché, purga todas las cachés.

 Resumen