Comments on: Change heading sizes on your Divi website

By: Cath

Cath — Thu, 16 Sep 2021 10:03:54 +0000

My understanding is that if you want to do this site-wide you’re probably best off to use css, however you can also make this change at module level.

Design tab > Heading text > H2 > set the font you want to use.

Remember you can right click a module you have just fine tuned, select ‘copy module styles’ then right click any other equivalent module and ‘paste module styles’ so you don’t have to make the exact same change to every module.

By: Cath

Cath — Thu, 16 Sep 2021 09:51:15 +0000

In reply to Kros.

Yes, you can do that within each module.

Design tab > Heading text size > hover to the right until the options pop up > select phone > set text size there.

Play around with vw settings rather than just px. Often you’ll get a better result across all devices.

Also remember you can right click a module you have just fine tuned, select ‘copy module styles’ then right click any other equivalent module and ‘paste module styles’ so you don’t have to make the exact same change to every module.

By: Kros

Kros — Thu, 19 Aug 2021 10:48:24 +0000

What if I need to change font size in mobile devices?
Do I need to write CSS for that? or is there any other options in Divi to do that?

By: Christina Truelove

Christina Truelove — Mon, 12 Jul 2021 14:44:49 +0000

I am wanting to set H2 as a specific font, different than H1. How do I do that?

By: Cath

Cath — Tue, 22 Dec 2020 06:08:01 +0000

In reply to Paul B.

1. Add your text in a text module.
2. Highlight the text you want as a header.
3. Click the drop down at Paragraph in the box above.
4. Select which header you want to use.
5. Style it at Design > Heading Text > choose appropriate header

By: Paul B

Paul B — Fri, 06 Nov 2020 09:46:35 +0000

Can I ask a more basic question? Where in Divi do I actually select a piece of text and specify it as a H1 Header? I can’t find that anywhere.

By: Laurence

Laurence — Wed, 17 Jun 2020 11:10:20 +0000

I had the same, setting H1 to 60px meant H2s were 51px. The only way to override it in the CSS was using !important for H2 size. BUT then overriding that in the module Design tabs was not possible.

So I had to not set H1 to 60px in DIVI settings and leave it at the default (30px), and set H1 to 60px in CSS, then I can set H2 size in the CSS without !important, which means I can override it in the Design tab.

So having only the H1 size setting in DIVI settings is pointless, and causes issues. They should either remove it, or add in all the headings.