Global Font settings in Pro

dear support,

for almost 2 weeks by now i have had several topics running or took part in, in order to understand global font settings. but i am not smarter than before. so i decided to ask only one question not related to any problems i experience on my site. starting from scratch so to speak:

could you please explain how i can achieve a global body font setting in pro? the goal being that an unchanged v2 text element will reflect these settings if plain text is applied to it?

maybe you could also refer to the customizer, theme typography settings and element settings (even though those should no be necessary i think).

thanks so much! kai

Hi there,

Thanks for writing in.

It depends on the situation, installed plugins, and which elements, the theme is not just the only one the apply CSS, it could be from other plugins or element’s existing options.

The V2 elements or even classic elements should inherit that font setting from global. ONLY IF, those elements purely text content with no class or inline styling. Some element contains its own font options, example, the ALERT element. It has font option that you could use which mean, this ALERT element shall not follow the global font option.

Hence, there is no permanent workaround, it varies on what a user wants to achieve and what should be changed.

In summary, those font style applied through element’s option or element’s class are local styling. Local styling is more prioritized than the global styling since it’s directly applied to the element. And in short, the global font options are only serving as DEFAULT styling once the element has no applied styling.

And with your request could you please explain how i can achieve a global body font setting in pro?, you’ll have to use custom CSS and !important for each style, that is to override the inline and local styling of your target element. And that is something you can’t do in global font option, GLOBAL means everything, and adding !important will apply the font styling to all existing element (that includes the text LOGO that is supposed to be with independent styling). In the end, you should decide what you should change and only apply that change to that specific element.

Thanks!

hi rad, thanks a lot for explaining!

just to clarify. i am only interested in the text elements (old and new) for body copy text. i understand everything you say and also think it should work that way. that other elements have their own default settings i can live with.
unfortunately you mentioned only “global styling” and did not specify if you refer to the customizer or the theme options in the builder. i am still interested how they interact.

from what i understand now, a way to work would be to ignore the customizer and the global font settings in the builder and just apply the font templates to the text element because it overrides the lower settings anyways. right?

unless i deactivate the font manager. but i did not want to do that since i wanted to work with templates which is a way i like to work coming from quark and indesign :wink:

if i set a text element to inherit and have a font template selected in the global font settings it is being applied as it should. that is good. but… and now i am at the root of my problem where it all started (or startled me ;). font size and weight fromt the global settings are not being applied! and i might understand the reason for that - even though it is very confusing at this point - the text element has no inherit setting for font size and weight. i have to set the values to something. deleting the value from the size setting is equal to zero size. and weight i have to choose any one.

so did i finally understand this whole font situation?

if so then it would be a great way forward to add more stylings to the font templates. like font weight, color, size and line height. that would be great!!!

thanks for your time and listening!! all the best, kai

Hello @iTurtle,

I saw that you just responded on here so I thought I’d make sure to put this in front of you. I’ve just written up a very detailed response that will hopefully answer your question on base fonts and having them inherit into elements over here:

Cheers!

@kory thanks a million for that detailed walk through. i will reread it later. but now i noticed that you did not refer to the customizer and font sizes. also my understanding of font weights seems to be right. they are not inherited because they have to (must) be set. so both: size and fontweight are not inherited from the font templates (weight) or global font settings of the builder (size). right?
anyhow. having font templates is a great great thing and i really want to use them exactly because of the reasons your mentioned. thanks! kai
@Rad please also refer to my longer reply. even though kory chimed in. thanks :wink:

@iTurtle, thanks for writing back. Great point on inheriting the weights as well. I will see what we might be able to do about that at some point moving forward. Cheers!

@kory what about inheriting sizes?
and did i understand that correctly now? is it supposed to be that way? that sizes and weights from the global settings are not being inherited by text elements? and what about the customizer in all this? ignore it completely???
thanks. kai

@iTurtle, there is no real way to “inherit” the font size for things like headings if adding a Headline Element, because each base heading has its own size. If we used inherit for font-size on these, everything would show up as the base font-size set in the Theme Options as that’s what it’d be inheriting. When using a Text Element, headlines used within that element will always show as they should and inherit from the base stylesheets, but when using something like a Headline Element, font sizes are to be set independently, as the purpose of these is to be able to style them to exacting specifications. Also, when the template system is in place, you could easily create multiple presets such as “My Custom h1,” “My Custom h2,” et cetera, and style each of these to match the base styles and apply it when working directly with a Headline Element if needed.

As for weights, we can certainly look into apply some type of weight inheritance with the Text Element or others to ensure that it gets the global base weight.

The Customizer is simply another way to adjust Theme Options, as you can do within the editing interface. This was the original way we mapped in global options, but we have our own system now within the tool that allows you to stay within one interface without needing to leave to go somewhere else. You can use one or the other, it doesn’t matter, but we do encourage all users to use Theme Options in the tool as it is developed from the ground up by us and integrates a little more smoothly into the workflow.

hi kory, thanks again for your reply! this all leaves me wonder (and this is what it all really started) what the font size and weight settings in the global typography settings are for if they can’t (and won’t) be inherited by the text elements since they always override the global font settings. thanks. kai

Please see https://theme.co/apex/forum/t/how-to-adjust-size-of-h1-h2-h3-in-pro-theme/12065/23?u=christian_y

thanks christian, of course by now i have a grip of how things are supposed to work in pro. but i realise and tried to explain it again and again, that it is not ideal and sometimes even misleading. that was my last post about. i wasted so much time on trying to find out why the settings in global typography don’t apply. now i know it is wanted by design. i still don’t know why you made it like this. but i can work with it now. even though it could be designed/implemented much better. but maybe you can’t admit to this because you have to be loyal. i understand that but it really did not help me. that’s all from me. i already moved to another system for new websites. thanks. kai

You’re welcome. Personally, when I first tried the V2 elements especially the Headline element, I was also confused because I was accustomed to using the old / Classic Headline element where it gets the setting from the Typography setting. Days later, the plan for the template manager was announced so I understood that it is connected to the planned feature.

I could not answer the questions regarding the decisions in product design. But, what made me learn quickly is because I know front-end things like HTML, CSS and the modern best practices. That is not common in other themes.

Thanks.

thanks christian!
what do you mean by “modern best practices”? i hope not that text now has to be formatted in each and every single text element separately? if still don’t get where this is going - template manager or not, sorry.
best regards, kai

One example of what I mean is the built-in responsive typography in X and Pro. Before, the only way to achieve responsive text is by using the Responsive Text shortcode which uses Javascript. That is an old method. Now, the best practice in setting up responsive text is by using scalable CSS units like em.

You don’t have to if you’re going to use the Classic Elements. The Classic Elements stays the same like in the past. They only get their style from the Theme Options.

The only thing that is lacking to some is heading levels font-size option. Currently, you need to do that in CSS. In the other thread, @Paul has submitted a feature request regarding this.

Thanks.

thanks for your reply christian,
i wrote this a couple of times before. but using the classic text element does not solve the problem. neither size nor weight of the global typography settings are reflected on the page. meanwhile i feel like a parrot i am sorry to say. also of course i’d like to use the new fancy v2 text elements :wink:
i think i have a very simple solution that would solve all the problems discussed regarding the text elements not using global font settings! here it comes:
why not set all the default settings of the text elements (especially v2) to “inherit”?
inherit color (not black by default)
inherit weight
inherit font
inherit line spacing (would be a great addition to the font templates)
is that not possible?
by the way: i still have funny numbers where the font weight should be. i am up to date with pro.
thanks a lot! kai

Hey Kai,

To your question:

Those are technically possible but it would be the product designer’s decision if it will be implemented or not. I’ll forward this as feature request.

There’s currently a bug with the font-weight which is currently under invesgitation. Please stay tuned for updates.

Thanks.

i have no doubt that anything is possible for your devs! :wink: but don’t you think that would make a lot of sense, too?

Hi Kai,

Thanks for the suggestion. We certainly appreciate the feedback! Please note that your suggestion has been added to our feature request list. All of these items are discussed with our team internally and prioritized based on the amount of interest a particular feature might receive. Thanks!

hi jade, thanks again. i noted that christian said he forwarded it as a feature request. what i was asking was his own opinion about that idea. wouldn’t that spare us all so much confusion about how things work? at least i would have saved me a ton of time an writing here… thanks, kai

Hi Kai,

Thanks for the feedback.

V2 Elements work with different technology which is not compatible with Theme Options settings.

The new solution will come to live soon.

We appreciate your interest in helping us improve the product.

Please stay tuned.

Thank you