Google Font call for Single Page (Custom CSS)

[lhd333]

I’m trying to use 2 specific fonts for my h1, h2 and h3 tags on a specific page..

I expect this to override my global CSS settings but it doesn’t seem to change the font at all. Please help.

Here’s what I’ve entered into the Custom CSS area:

h1 {
    font-family: 'Montserrat', sans-serif !important;
    color: #000000;
    font-size: 250%
}

h2 {
    font-family: 'Montserrat', sans-serif !important;
    color: #000000;
    font-size: 200%
}

h3 {
    font-family: 'Domine', !important;
    font-size: 160%
}

[Joao]

Hi There,

I have tested and your code works, there is a small mistake on the h3, there is an extra , and also you forgot the ; after the h1 and h2 font-sizes.

So Please update your code to :

h1 {
    font-family: 'Montserrat', sans-serif !important;
    color: #000000;
    font-size: 250%;
}

h2 {
    font-family: 'Montserrat', sans-serif !important;
    color: #000000;
    font-size: 200%;
}

h3 {
    font-family: 'Domine' !important;
    font-size: 160%;
}

If you don´t see the changes reflecting on your live site:

1- If you are using cache plugins, flush your cache.

2-Clean your browser cache and test it again.

Hope it helps

[lhd333]

I appreciate the punctuation correction however it doesn’t seem to change the fonts.

To be clear, my standard heading font is Open Sans (Google).

I can readily change the fonts through Customizer>Typography>Headings Font but I can’t override them using the custom CSS button in cornerstonre where I’m trying to apply the special css code.

I’ve tried resetting browser cache (and using incognito mode) - no change.

Please advise. I will add secure note with my login credentials.

[Joao]

Hi There,

I have applied the code to your home page > Cornerstone > CSS and it seems to be working. See the live site on the image attached.

Please clarify the issue.

Thank you

[lhd333]

I can barely see your photo (it’s not clickable so I can read it). Can you attach a link to the screenshot that I can maximize?

[jordanj]

Hello there,

A link to the photo attached previously by my colleague can be found here:

I hope this helps.

[lhd333]

Thank you.

Unfortunately, the font that is displayed is not correct. They appear to just be"generic" serif and sans-serif fonts.

See:

Google Fonts

Google Fonts

[friech]

Hi There,

Your custom CSS code would not work, because your site is not requesting those two Google Fonts in the first place.

Please add this on top of the Page CSS or on child theme’s style.css file. (nope not on the Theme Options > CSS)

@import url('https://fonts.googleapis.com/css?family=Domine:400,700|Montserrat:100,300,400,600,900');

That line will request the Domine and Montserrat font from Google.

Hope it helps,
Cheers!