[WordPress] Google Font changes when publishing page

[Zoom7000]

I've set up a blog using WordPress. For my blog, I've been using the Google Fonts addon and selected a particular font that I want to use for the text. In this case, it's called "Imprima". However, if you notice, the font changes for any links, bold text or italic text. It only changes however when I publish the page. During edit mode, all of the text appears in the correct font.

 

Any ideas what could be causing this?

[bald_pig]

Imprima doesn't have a bold typeface:

https://fonts.google.com/specimen/Imprima

[Zoom7000]

Imprima doesn't have a bold typeface:

https://fonts.google.com/specimen/Imprima

 

That doesn't explain why it does work when in edit mode.

 

 

 

[bald_pig]

That doesn't explain why it does work when in edit mode.

 

[ATTACH=CONFIG]57081[/ATTACH]

 

[ATTACH=CONFIG]57080[/ATTACH]

 

[ATTACH=CONFIG]57082[/ATTACH]

 

No, but it explains why it doesn't work when published

 

Fonts like Roboto have everything: https://fonts.google.com/specimen/Roboto

[Zoom7000]

No, but it explains why it doesn't work when published

 

Fonts like Roboto have everything: https://fonts.google.com/specimen/Roboto

 

I think it's an issue with the default "Twenty Twenty" theme in WordPress. I've changed it to "Twenty Sixteen" and the font displays better now. Weirdly, bold is displaying too!

Edited March 6, 2020 by Zoom7000

[ZeroHour]

Basically when in edit the editors font/css is applied and the css that was blocking/not applying to the A element was not applied to the A tag when you are editing as it wont be inherited. When you save the actual page css will be applying and the css that targets the article A tags which doesnt have the font applied. The style= tag doesnt apply to sub elements which you had on the P tag and each element under would need that style override to work or really just edit the css and tell it to apply to A tags.