Edit H* font sizes

Support
#1

Hi,

I searched, but did not found any settings where I can modify the font size of my H1-H6.

When I use the Headline-Element on a page and adjust in Setup/ Base Font Size & Tag the font size manually (EM) it works, but for any Tag (H1-H6) there is no change at all.
Under typography in the theme settings I can edit the letter spacing, but no font-size?

When I use Setup/ Edit Text and use there the dropdown for the H1-H6 it works that different font sizes are set. But I cannot edit the preset of this H1-Fontsize definitions.

would be great if I could get support here, cause this is a mandatory basic for the whole site. As I understand or want is, when I change the global definitions of H1-H6 they will take affect everywhere I use it on the site, right?

thanks,
Max

#2

Hello Max,

Thanks for writing in!

The Heading tags will depend on the typography settings in X/Pro > Theme Options > Typography > Root Font Size. If you want to manually adjust the heading font sizes, you will have to use a custom css instead. please add the following CSS code in the X > Theme Options > Global CSS (http://prntscr.com/evui3r)

h1, .h1 {
  font-size: 3em;
}

h2, .h2 {
  font-size: 2.75em;
}

h3, .h3 {
  font-size: 2.5em;
}

h4, .h4 {
  font-size: 1.5em;
}

h5, .h5 {
  font-size: 1.2em;
}

h6, .h6 {
  font-size: 1em;
}

Feel free to adjust the font size values.

#3

Hi RueNel,

thanks for your answer. Now this is clear, regarding the font sizes, on base of the manual root font size I set, all others will be defined automatically, right?
But what’s about all other definitions, like font weight for example?
And why does the font size not scale dynamically depending on the viewport/browser resolution?

Best,
Max

#4

Hello Max,

You will have to use the Root Font size for better font responsiveness. You might want to check out first this article how you can apply responsive typography:

You can change the font-weight along with the font family in X/Pro > Theme Options > Typography > Headings or in X/Pro > Theme Options > Typography > Body and Content.

Hope this helps.

#5

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.