Return to previous page

Adjustment sizes of the H1, H2 and other headers

This topic has 10 replies, 2 voices, and was last updated 3 weeks, 1 days ago ago by Luca Rossi

martijntje

Participant

May 7, 2025 at 11:37

Hi – I got a question about adjusting heading sizes.

In the ‘Theme Custom CSS’ I got rules for changing some of the styles of the H2 and H3 headers, for example:

H3
{
font-family: “niveau-grotesk”, sans-serif;
font-weight: 600;
font-style: normal;
color: #e51f25;
size: 2px;
line-height: 28px;
}

The font-type, the color is loading correctly; the size and line-height are not loading in the frontend. The font is a different size than the 2px I entered.

Do you have any suggestions?

Tnx.

Please, contact administrator
for this information.

#443443 Copied Theme version: 9.4.11

9 Answers
Luca Rossi

Support staff

May 7, 2025 at 18:13
Dear @martijntje,

Your size of heading is incorrect, please try with this custom CSS codes instead:

body h3 { font-family: "niveau-grotesk", sans-serif; font-weight: 600; font-style: normal; color: #e51f25; font-size: 28px; line-height: 28px; }

Hope it helps!
#443478 Copied
martijntje

Participant

May 8, 2025 at 17:32

Hi – tnx! It worked.

I also have a H2 on that page which won’t change with your code, see ‘You may be interested in…’.

Do you have solution for that?

Tnx!

Please contact administrator
for this information.

#443587 Copied
Luca Rossi

Support staff

May 9, 2025 at 05:25
Hi @martijntje,

You can try with this code:

body h2.products-title.cross-sell-products-title { font-family: "niveau-grotesk", sans-serif; font-weight: 600; font-style: normal; color: #e51f25; font-size: 28px; line-height: 28px; }

Hope it helps!
#443597 Copied
martijntje

Participant

May 21, 2025 at 17:08

Hi thanks,

The code works, but I does not change the H2 product titles.

Is there a code for that adjustment?

Thanks in advance.

Please contact administrator
for this information.

#445093 Copied
Luca Rossi

Support staff

May 22, 2025 at 08:01
Dear @martijntje,

Could you please update previous CSS codes to this?

body .content-product .product-title, body h2.products-title.cross-sell-products-title { font-family: "niveau-grotesk", sans-serif; font-weight: 600; font-style: normal; color: #e51f25; font-size: 28px; line-height: 28px; }

Let us know how it goes!
#445133 Copied
martijntje

Participant

May 22, 2025 at 13:00

Hi tnx – it fixed the type, but the line-height is not changing at the frontend when I change it in the css. Is there a way to fix that?

#445171 Copied
Luca Rossi

Support staff

May 23, 2025 at 07:44
Hi @martijntje,

Can you force the line-height with the important?

Like this:

body .content-product .product-title, body h2.products-title.cross-sell-products-title { font-family: "niveau-grotesk", sans-serif; font-weight: 600; font-style: normal; color: #e51f25; font-size: 28px; line-height: 28px !important; }

Let us know how it goes!
#445223 Copied
martijntje

Participant

May 24, 2025 at 08:31

Tnx – it fixed it.

Problem is now that it works in Safari, in other browsers (Firefox, Chrome) the product title is in Times New Roman.

Is there a fix for this?

Tnx.

#445336 Copied

Luca Rossi

Support staff

May 24, 2025 at 19:56

Dear @martijntje,

We hope this message finds you well.

Kindly ensure that the Niveau Grotesk font is installed correctly on your system. Safari requires certain font types to be properly installed in order to display them as intended.

Please note that Safari generally supports a wide range of font formats, including TTF, OTF, WOFF, and WOFF2. It also accommodates extended system fonts such as ui-serif, ui-sans-serif, ui-monospace, and ui-rounded. However, there may be occasional issues with specific font formats or configurations—particularly with self-hosted Google Fonts and certain font weights. These issues can often be resolved by adjusting the @font-face rule or modifying the font-weight properties in your stylesheet.

Should you need any further assistance, please do not hesitate to reach out.

Best regards,
The 8Theme Team

#445430 Copied
Viewing 10 results - 1 through 10 (of 10 total)