Body Font in Pro

hi there,

whatever i do, i can’t seem to get control over the body/text font in pro.

the global theme settings are not being honoured in the v2 text element and also not in the old text element.

i really need a global font control. not for each element. that would be far too much work if i want to change the size site wide later on.

the font templates produce duplicates and several times a day i have to delete them manually.

the settings under “theme opions -> typography” are being ignored but the color which i take from the color template.

but content font size (rem), selected font from font template, weight and italics are all being totally ignored. in old and new text elements.

so i tried this but with very poor results:

body .entry-content {
  font-size: 1em;
  line-height: 2em !important;

font control got somewhat complicated in pro and the new x. would you have a walk through how to work with global font stylings?

thanks a lot! kai

ps: i do not use the “customizer” from the top menu since i read in pro we should only use the pro editor. they seem to override each other anyways.

1 Like

Hey iturtle…and hopefully some Themeco staff read this as well.
I had a very similar problem and I just found a workaround I think… I went to templates> Fonts… and there I was able to change the dammed font :slight_smile:
It is super hidden and I am confused… where should we adjust setting now?
Customizer Not??? So why Themeco not turns this menu off in Pro?
Then we have Theme options… and now I see this “FontManager” in the Templates Menu… that is really confusing…
…Makes me crazy and thinking about checking out other themes…

But anyways, no hard feelings :slight_smile:

Peace and Love to everybody :kissing_heart:


thanks a lot @maik. your are right it keeps getting confusing since pro or v2. sometimes 2 or 3 or even 4 places to change the same thing. i already use the templates for colors and fonts which i really like. but these templates are duplicating themselfs automatically (beware!) and mess things up. still i can’t change font size (rem) and the italics style does not work either. color and font seem only to work via templates. but only in v2 elements (of which i am not so sure anymore).


ok. i see @iTurtle … today i faced the duplicating text-template thing the first time … but affter deliting the duplicates it was ok again, hope you get things sorted out soon :slight_smile:
good luck!

The duplicating font issue is intermittent and you don’t have to delete the template but reloading will get rid of the duplicate.

@iTurtle, I checked and I didn’t see the duplicate problem. If you encounter it again, try reloading the page.

I also checked if the Font Manager works and it does. I see you have Open Sans font as the Body font and Lato as the Headline and it’s taking effect.

When I continued investigating the other issues you described, your site went down.

@Maik, please open a separate thread as the cause of your issue might possibly be different.


@christian_y thanks for your reply!
reloading the template page actually does get rid of duplicates. well…

but! i really need a solution for the not working typography settings in theme options.
settings don’t apply. only the color for the body font (coming from the templates) works.
but not the body font selection (inherit, body and headline in my case), size (rem), weight or italic. neither in the classic text element nor the v2 text element! i am pretty clueless what to do next.

i did not change any settings in my text elements so thy won’t interfere with the global theme settings.

i also went to the customizer like it was suggested in another font trouble thread and selected everywhere a system font (arial) not google fonts anymore.

i am still confused about if to use the customizer at all with pro. why do they interact with another? that makes things impossible to understand an control.

finally i even deleted the pro theme and reinstalled it again. to no avail.

could you please give the correct css for the body font? i mentioned this which does not work:
body .entry-content {
font-size: 1em;
line-height: 2em !important;

thanks again for your help! kai

Hi kai,

I see the issue in your site but I have not yet discovered what’s causing this in your site. This is not an issue with my test site so there could be something in your server causing this. I was investigating why the options doesn’t work in your site but it suddenly doesn’t load anymore so I suspect there’s something wrong with the server setup. Please give cPanel access in a Secure Note.

We’re sorry for the confusion regarding the Theme Options and the Customizer. It is recommended to use the Theme Options because it is connected with the builders. For more details, please see the Theme Options introduction in our changelog. But, the only problem is when you use the Font Manager, it is not connected to the Customizer anymore and if you’re using a Google Font in the Customizer, it will be loaded. I’ve already submitted a report regarding that. Other settings are the same and connected. I believe this all will be synced progressively.

The body selector is simply body. body .entry-content only targets texts with the exception of headlines in the content area. Here’s an example adding text properties to it.

body {
font-family: "Times New Roman", Georgia, Serif;
font-weight: bold;
font-size: 1em;

For more text properties, please see


@christian_y thanks so much for your reply. maybe we are now coming closer to the misbehaviour of my installation. i am not sure what you mean with cPanel. i put my login in a secure note here for now.
can i ask my provider something about the server installation? can they change something?

the body css code changes all the fonts on the page. but i need the body font separated from the header font.

regarding the theme options vs customizer: i set all the fonts in the customizer to system fonts and don’t touch it anymore… i really hope this will be sorted out very soon. my work is on pause for over a week by now…

best regards, kai

Hi there,

Is this related to your other thread? It’s just a bit confusing having multiple threads. Let’s discuss this there :slight_smile: I replied to your other thread, I need to know a specific element that you wish to change so we can recommend CSS with proper selectors. Example,

body {
font-family: "Times New Roman", Georgia, Serif;
font-weight: bold;
font-size: 1em;

h1, .h1 {
font-family: "Times New Roman", Georgia, Serif;
font-weight: bold;
font-size: 2em;

h2, .h2 {
font-family: "Times New Roman", Georgia, Serif;
font-weight: bold;
font-size: 1.5em;

/* so on */

That headline and body text, but, other elements have its own headline and styling too. But yes, that’s the global CSS for headlines and body text.


@Rad thanks for your reply! but this is going in a completely wrong direction again! what you are asking is exactly what i am not interested in. i am not interested in a specific element. i am interested how to set up global font settings so that they will reflect in default text elements. i can easily work in a specific element. but that is too cumbersome for a whole site. i tried to make things simpler. pls have a look here:
@christian_y what do you mean with cPanel?
thanks! kai
by the way. is this still up to date?
i am trying to address my main menu/nav with css.

Hello everybody,

I just wanted to jump in here really quick to provide a post that will hopefully outline in detail the way font settings are “stacked” in the theme as well as a little more context for how to utilize different workflows based on your needs.

Introduction to the Font Manager

Before we even get into assigning fonts anywhere, let’s take a moment to review the Font Manager under Templates → Fonts in the backend. The purpose of utilizing the Font Manager is to have a centralized place to setup fonts utilized across your website for easy reuse as well as updating them from one central place rather than multiple (potentially dozens or hundreds) of spots. Take the following screenshots as examples:

In these examples, I have setup 2 font families to be utilized on my site. I have named one Body Copy and the other Headings. I can name these whatever I wish, and make as many as I wish to assign, but we’ll use these 2 to keep things simple. What I’m doing when I create these fonts is making an abstraction, which can be assigned where necessary and easily overwritten later if needed. So if I go into an element and assign the “Body Copy” family to it, what I’m really doing is saying font-family: Georgia; in this case, and then based on the font weights I added in the manager, those options will pull through to the element for me to use like so:

This keeps things organized and consistent across multiple elements. Now lets say down the road I don’t want to use Georgia anymore as my “Body Copy” font-family, and instead wish to use Helvetica. Without these font manager abstractions, you would have to go back to each individual element and change Georgia to Helvetica over and over and over again. However, if utilizing the Font Manager, you can simply go back to this one central spot, update the font-family, hit Save, and these changes will be reflected out across all “Body Copy” assignments on your site from Theme Options (if you’re using it there) to individual elements.

That is the real power of utilizing the Font Manager, and it is highly encouraged that you do so for all the reasons mentioned above, but you do not have to utilize it, or can use it to varying degrees of integration as you wish and you will see below.

Setting up “Base Fonts”

Starting from the very base level, the first thing you will want to do when setting up your website is define the overall foundational fonts used for your “body copy” (all text other than headlines) and your headlines. To do this, go to Theme Options → Typography and to start, you can choose to opt-in to the Font Manager system mentioned previously, or you can assign fonts directly by turning the Enable Font Manager option on and off as you wish. If you turn this off, you will assign all of your fonts and weights directly within the Theme Options panel. If you turn this on, you will need to setup a font group in the Font Manager first, then you can come back here to assign it.

Starting with the Body and Content settings, let’s say you assign Lato as your font-family and 400 as your font-weight in here (either directly, or via the Font Manager’s groups). On the frontend, those styles are translated as such:

body {
  font-family: "Lato", sans-serif;
  font-weight: 400;

So at the very base level, Lato with its associated font-weight is assigned to the body tag. Next, for the Headings section, let’s say you assign Lato as your font-family and 700 as your font-weight. On the frontend, those styles are translated as such:

h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 {
  font-family: "Lato", sans-serif;
  font-weight: 700;

So all of our most base level heading tags, as well as the theme’s heading modifier classes will receive these font settings. Now that we’ve assigned both of these values, let’s go take a look at a simple blog post that I’ve mocked up (I just wrote this directly in the WordPress backend, not using any page editing from the builders):

Note that all of my base level copy is using the 400 weight for Lato, and all headings are using the 700 weight for Lato. This you can see takes place inside my main content, as well as my sidebar area with the widgets, and also throughout all other areas of the theme. This is my site’s base typographic foundation for working with fonts.

Using Fonts in the Builders

Now, if I switch over to utilizing a builder, we have a couple options for how we can either use these base fonts, or alter them as needed on a case by case basis. Going back to my initial example where we were using Georgia as our “Body Copy” font and Helvetica as our “Headings” font, let’s pretend that I have assigned those values in the Theme Options as well to their respective places. If I go into a page in the Content Builder and add a Text Element, you would see something like the following:

You will notice how the text of the Text Element has taken on the base font setup from the Body and Content options set in Theme Options. This is because by default, the setting for the Font Family option in these elements is inherit, which means it will take on the font-family of its parent. Since all the way up the chain, that font-family in this case is Georgia (unless otherwise customized by yourself), Georgia is the font you should see (as we do here).

Also, take note that when inherit is selected as the Font Family setting, all font weights are available to you in the Font Weight dropdown. This is out of necessity as we can’t determine what font’s you’re inheriting, and you might have multiple weights associated with a particular font, so you can set them as you please using this setting.

Next, if we happened to assign the Body Copy option from the Font Family dropdown, we would notice that nothing changes. This is because we had matching settings of Georgia for our site’s base body styles, and for this Font Manager grouping. The only thing that changes when selecting this option is that only our font weights assigned in the manager would be available in the Font Weight dropdown now, as we’re not utilizing the Font Manager system in full.

Next, if we decided to apply the Headings option from the Font Family dropdown, you would see the following:

The font-family has changed to Helvetica as that is the assignment for my Headings group in the Font Manager. I’ve also changed the weight to 300, as that is one of the weights I assigned in the Font Manager for this grouping. So we can use the Font Manager to assign alternate values to different places when we want. This is helpful because there are certain situations where you may have a headline that you wish to visually appear like regular text, or perhaps you have a short run of text you wish to visually appear as headline text, but we want to keep their semantic meaning the same.


We’ve seen how all the levels of font management options build on one another to provide the necessary levels of customization from global, down to individual instances of elements. @iTurtle, referencing your statement of “I am interested in how to set up global font settings so that they will reflect in default text elements,” hopefully you can see that there are multiple ways to do this, and by default, this should be happening using the Inherit method for the Font Family dropdown with an element. However, keep in mind that even if you do decide to go the route of assigning a Font Manager group to each element, the whole point of this is so that if you decide to go back later and change fonts, you can easily do this from one place, and not have to go into all elements. If you find that you still have questions after going through this write-up, we will be happy to continue providing assistance in clarifying anything that might need it.



This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.