How to change all post body fonts at once?

Hi there,

The post body font simply inherits the settings under Typography > Body.

If there are certain paragraphs that don't work, it's likely that there are extra CSS or HTML inline style added that needs to be removed.

If this is not clear, can you guide me to a post and section where I can see the issue?

Let me know :)

The typography in the customize section is already set as I want for all the post.

But when I was not using GeneratePress in my initial days, I used to TinyMCE plugin to customize font and font size for each post.

Is there any CSS I can use...

That depends.

Can you guide me to a post and section where I can see the issue?

Here is the example of the post having different font https://www.staymeonline.com/tricks-you-should-know-for-affiliate-marketing/

It's added as HTML inline style so it's not possible to overwrite using CSS unfortunately:
https://www.screencast.com/t/xEWfRVKf

You will need to manually remove that.

Okay, thanks for the help...

No problem :)

Hello, LEO!

As you know, some post has custom inline HTML added...

How can I change all post font to make same at once?

Hi there,

the only way to overwrite inline styles is by the use of important eg.

span {
    font-size: 20px !important;
}

You would need to target any and all elements that use inline styles in this way.

Thanks, David!

It is hard for me to understand, Can I make it simple?

When adding styles using Tiny MCE it wraps the content in a span tag where the inline styles are added so this:

<h2>A title</h2>
<p>body text</p>

becomes:

<h2><span style="font-family: georgia, palatino, serif; font-size: 18pt;">A title</span></h2>
<p><span style="font-size: 14pt; font-family: georgia, palatino, serif;">body text</span></p>

So you have to target each of those Elements eg. p span, h2 span and override the inline CSS using !important.

e.g Changing all of those spans font-family:

p span, h2 span, h3 span, h4 span {
    font-family: "Alegreya Sans" !important;
}

Then you will need to set there font sizes individually eg.

p span {
    font-size: 24px !important; 
}

Understood!

But I don't want to change using CSS, Because It will create the same issue in future.

Is there any way I can remove all those TinyMCE custom HTML?

You would have to search and replace them in your SQL Database. Not something within our scope.