Advanced typography settings

Our themes typography settings are divided into several groups. You are able to set your font settings in Dashboard -> Theme Settings -> Typography for the following sets:

1. Text font. All your website texts like products descriptions, blog posts content, pages texts.
2. Primary font. Used for title elements like H1, H2, our WPBakery “Section title” element etc.
3. Entities names. Font for your products, posts and categories titles.
4. Secondary font. Font for your section subtitles texts or for elements with CSS class “font-alt”.
5. Widget titles font. Sidebar and footer widgets titles group.
6. Navigation font. Style for your main navigation links in the header.

So these settings allow you to set font styles for all your website’s elements globally. But there are a lot of elements that you might want to set different styles regardless of global settings. For example, change font size for the price, set color for mobile menu links, increase post titles font size, change breadcrumbs color etc. And that is where our “Advanced typography” section will help you. You can find in Dashboard -> Theme Settings -> Typography -> Advanced Typography. From there, you can set the unlimited number of rules for any element of your website.

By default you can specify font settings for a limited number of selectors that we defined based on all most popular customers requests like for navigations, prices, titles, breadcrumbs etc. We will be working on this list in our updates and add more required selectors there. But you can also use “Custom selector” option that allows you to write your own CSS selector and apply any font rules to it. For example if you want to change font size for the “BILLING DETAILS” title on your checkout page you need to write its selector to the field like .woocommerce-billing-fields h3.