Problem with typography – global - by Peter

Hello @Peter,

After reviewing your website, we noticed that you are currently using both Elementor and WPBakery page builders. This setup is not recommended, as each builder loads its own assets and scripts, which may cause conflicts. We suggest choosing one of these builders and migrating the content created with the other to ensure consistency and optimal performance.

Regarding the issue with font families, the content on the page you shared was built using the WPBakery page builder. Some of your headings have individual font settings applied, which is why they appear differently. We recommend enabling the option to use the theme’s default font, as shown here: https://prnt.sc/08icG4Hi5Hq0. This will allow your headings to inherit typography settings from the Theme Options: https://prnt.sc/xflh3C_QiDKr. Alternatively, you can use automated tools (such as AI) to modify the heading code directly by adding the use_theme_fonts=”yes” param to heading missing such arg: https://prnt.sc/vY5Iafi1mlj7. There are no automation configuration in Theme Options for such case.

If you would like all your headings to appear capitalized, please add the following CSS snippet:

h1.vc_custom_heading:not(.no-uppercase), h2.vc_custom_heading:not(.no-uppercase), h3.vc_custom_heading:not(.no-uppercase), h4.vc_custom_heading:not(.no-uppercase), h5.vc_custom_heading:not(.no-uppercase), h6.vc_custom_heading:not(.no-uppercase) {
    text-transform: capitalize;
}

Best regards,
Jack Richardson
The 8Theme’s Team

Hello @Peter,

“But I have it enabled in the settings, as you noticed.” -> Yes, you have this option enabled in the settings, as you mentioned. However, it is applied only to some headings, not all of them (https://prnt.sc/2OY9x0NTDacO). For the headings where it is enabled, the correct global font is applied (https://prnt.sc/2Tig1_VFEUUz → https://prnt.sc/AZ0vQ3o3zyzS).

Best regards,
Jack Richardson
The 8Theme’s Team

Hello @Peter,

By default, all WPBakery custom headings are styled in uppercase. However, if you would like to display them in their default text format, you can add the “no-uppercase” class to the heading.
Please refer to the following link for reference: https://prnt.sc/Z7_B0GrvJP7v.

We have already added this class to the page you requested, so you can review the result.

Best regards,
Jack Richardson
The 8Theme’s Team

Hello @Peter,

We have added this class to each heading on the mentioned pages. If you would like to implement it using CSS, please follow the suggestion provided in our next reply: https://www.8theme.com/topic/problem-with-typography-global/#post-470335. Also, you can modify the CSS (to keep the origin text-transform of your wpbakery heading widget globally):

h1.vc_custom_heading:not(.no-uppercase), h2.vc_custom_heading:not(.no-uppercase), h3.vc_custom_heading:not(.no-uppercase), h4.vc_custom_heading:not(.no-uppercase), h5.vc_custom_heading:not(.no-uppercase), h6.vc_custom_heading:not(.no-uppercase) {
    text-transform: unset;
}

Best regards,
Jack Richardson
The 8Theme’s Team