Theme Fonts settings (Post Content) not applying with Gutenberg blocks
Hi Newspaper support,
I’d like to set Georgia 12px as the default font for post content. I went to Theme Panel > Theme Fonts > Post Content and set it there, but the change doesn’t seem to take effect.
When I use Gutenberg blocks, the text still appears smaller than expected — Georgia 12 only displays correctly if I use the Classic Editor instead.
I also noticed that if I go into the block options and manually set the Typography size to “M”, the text does display correctly in Georgia 12. However, I don’t want to have to set this manually every time — I need it applied by default, automatically, without editing each block individually.
Theme: Newspaper, version 12.7.6
WordPress version: 7.0
Could you help me understand why the Theme Fonts setting isn’t being applied automatically to Gutenberg content, and how I can fix this so the font applies consistently by default, regardless of which editor I use?
Thank you very much for your help.
Kind Regards
Antonella
Hi,
That depends. In normal circumstances the theme font settings should apply to all the posts.
If I check some of your posts, the theme font setting applies correctly -> https://prnt.sc/xpP4ATn0UUo4 Those are clean paragraphs and they use the correct settings from the theme panel.
For other posts however, from what I see the text from the post content comes with its own font settings -> https://prnt.sc/uQWOT3r0V1eE And most of the content isn’t paragraphs, it’s span containers. There is a font family and a font size of 12pt (which is about 16px) set for them.
Such inline styles are very strong, meaning they can override the font settings from the theme -> https://prnt.sc/2-22uttCGOR2
In case you aren’t manually adding span containers with inline styles in the post content, then maybe the text is built and/or copied from somewhere else, along with it’s style from there.
The easiest fix would be to enforce the desired font size and override the inline styles to make them use the 12px font size. A code like this one should work -> https://prnt.sc/Sf-v9NpVE7ID
Please copy this code:
.single article .td-post-content span {
font-size: 12px!important;
}
And enter it either it in the theme panel custom CSS code section -> https://prnt.sc/xGyxgRA6plQC
Then clear the cache and check if the post content looks as you want.
Let me know.
Thank you!
Hi,
When I add this code, the text appears too small, both when used in a normal block and in a classic paragraph:
The font size is set to 12, but it doesn’t render as an actual 12pt — it displays much smaller than that. Even if I increase the font size value, the text still stays just as small and doesn’t change.
Could you please check why the size isn’t being applied correctly?
https://drive.google.com/file/d/1mNdMANvtH9s3fCRpURR26iO-JL4EtadY/view?usp=sharing
Thank you,
Antonella
That code should make the post content have 12px.
Let’s discuss it more. So the way I saw it, the theme font settings weren’t applying to some of the posts, because they don’t contain paragraphs.
This post contains paragraphs for example -> https://raccontareancora.org/cose-la-lettura-ad-alta-voce-espressivo-letteraria-e-la-rilettura-1-silvia-blezza-picherle-con-linsegnante-monica-maliga/ So if I check with the browser inspector, the theme font settings are applying correctly -> https://prnt.sc/V-6xbJcCvFle
This post doesn’t contain paragraphs -> https://raccontareancora.org/lettura-ad-alta-voce-espressivo-letteraria-due-favole-al-telefono-surrealiste-di-gianni-rodari/ it contains span containers which have font properties set directly on them. But the code I provided will override those and make the font 12px -> https://prnt.sc/4YGjdpWqzIBA
However, if you also set the font size in wordpress here -> https://prnt.sc/h_aiUU9e0gbM then that size will be used, which is normal if you want to make a specific paragraph stand out or be different in terms of font size.
It depends on what exactly you want to do. you mentioned that you want the post content to have 12px. That is a bit small, but it’s fine if that’s what you want. Setting 12px in the theme, and also using the code I provided, should result in having a 12px font size in all the posts. No need to do anything else or set other font sizes somewhere else.
In case I am misunderstanding something please correct me.
Thank you!
Hi,
I have the following CSS applied via custom CSS:
css.td-page-header {text-align: center;}
.single article .td-post-content span {
font-size: 12px !important;
}
Even when I increase the value to 14px in this CSS, nothing changes visually — the text stays small. More importantly, this rule is now blocking any manual font size changes I try to make directly in the editor, whether by:
Setting a custom font size manually on a classic paragraph, or
Selecting a preset size (e.g. “M”) on a paragraph block.
Previously, when the font size was set through the default Theme Panel settings (without this custom CSS), the sizes displayed correctly and could be adjusted normally.
If there’s no solution, I’ll remove the code and set it to M every time I write a post, using the paragraph block.
Thank you for your help
Antonella
I should mention again that this code is just for some posts, meaning the ones where the font settings from the theme are not applying. This code will apply only for some of the posts. The rest of the posts will use the size set in the theme panel.
If I modify it in the code to 14px, it seems to apply correctly.
So 12px -> https://prnt.sc/AeLXXEbe2UAJ
And 14px -> https://prnt.sc/ycdiTKBhijQs
As I mentioned, the font settings from the theme apply to paragraphs, because usually the main part of a post content is made out of paragraphs. The problem you are having is that some of the posts do not have any paragraphs. Instead there are these containers -> https://prnt.sc/VsidZDYnkUYQ which also have a style set on them inline. These will not be affected by the theme font settings and will have a font size of 12pt (about 16px) according to the style set on them inline.
Assuming that you aren’t manually creating those containers or adding font settings on them manually, the remaining explanation is that the text is copied from somewhere else along with the styles.
So I’m not sure what to suggest unfortunately. There are too many variables for the post content and the multiple font settings that apply to them.
Thank you!
Hi,
Thank you very much for the support, I’ll try again! 🙂
