Line Height Overview
Why Do We Need This
Divi has always struggled with setting font sizes on your website. First, they relied on the Customizer, but that was terrible. Then the had Default Styles, and that was pretty cool. Then they removed that, and called their new feature Presets. These work great, except for one major problem! They are module specific. This means you have to literally go into every single module and set your H1, H2, H3, H4, H5, H6, Text, and Body line height for every single module on every single device size…phew! This is quite the chore, but not anymore!
What This Feature Does
Our plugin gives you input fields in the Divi Theme Options to set each of your heading (H1-H6) and paragraph (text, body text, etc.) line height across your entire site. That’s right, all you do is set your text sizes once, and ta-dah! Every module on your website will now have consistent line height, and it only takes a few minutes to set up! You can use whatever value you prefer, like px, em, rem, etc.! And the best part is that you can override any of these settings at any time in any of the module settings! How cool is that!
NOTE: This setting works hand-in-hand with the Global Text Sizes setting.
Keep in mind that the line height set in the Divi Responsive Helper plugin settings become the site defaults UNLESS overridden. Any module line height or Divi Preset line height overrides our settings and takes priority!
How To Use The Global Divi Line Height Settings
How To Enable The Feature
To begin using the global text line height settings, simply go to the Divi>Theme Options. There you will see a new tab that our plugin adds called “Divi Responsive Helper.” Once you click on that, you will see more tabs. Click on the “Typography” tab to begin configuring the settings.
Available Global Text Line Height Settings
Below is a list of all the line height settings that are available. Each of these has an input field where you can set the value and unit. For example, you could set the H1 Desktop to 1.2em.
- H1 Heading Line Height
- H2 Heading Line Height
- H3 Heading Line Height
- H4 Heading Line Height
- H5 Heading Line Height
- H6 Heading Line Height
- Paragraph Line Height