All typography options are located within their specific Theme Options panel. For example, if you’d like to customize your main menu typography settings, then you would find those options in the Menu > Main Menu tab, under the ‘Main Menu Typography’ section. If you don’t find the typography settings for a specific feature, it may be because it’s been combined into a general typography option for global use.
These typography options are located in Avada > Typography and relate to the global use of the sites body font, Headers (H1-H6), Post Titles including Single Post Title Extras such as “Comments”, “Related Posts or Projects” and “Author Titles” etc
Typography Options Settings
Font Family – Illustrated as A. Controls the font family to be used.
Backup Font Family – Illustrated as B. Controls the backup font family to be used in case the primary font doesn’t load correctly.
Font Weight and Style – Illustrated as C. Controls the font weight and style to be used.
Font Subsets – Illustrated as D. Controls the font subset to be used.
Font Size – Illustrated as E. Controls the size of the text on display.
Line Height – Illustrated as F. Controls the spacing between lines.
Letter Spacing – Illustrated as G. Controls the spacing between letters.
Margin Top – Illustrated as H. Controls the top margin of the text.
Margin Bottom – Illustrated as I. Controls the bottom margin of the text.
Font Color – Illustrated as J. Controls the color of the text.
Feature Specific Typography Options
To customize specific typography options, such as Menu, Page Title bar, Sliding Bar, Footer, and the like, navigate to their specific panels to access their different typography options such as font family, weight, size, etc.
Font Face Rendering
With Avada 5.8, we have added a font performance feature for Font Face Rendering. Located at Avada > Theme Options > Performance > General, you will find the Font Face Rendering option. Here you can chose “Swap” for faster font rendering with possible flash of unstyled text (FOUT) or “Block” for clean rendering but a longer wait time until first paint.
Responsive Heading Typography
For Avada 3.8.8 and newer this option is located in the Theme Options > Responsive tab.
The Responsive Heading Typography option allows you to enable or disable responsiveness for all headings. Please note that this is based on a calculation of font size and screen width and is done automatically. This helps your layout look more proportionate on smaller sizes. You can also use the ‘Responsive Typography Sensitivity’ option and the ‘Minimum Font Size Factor’ option to further adjust the responsiveness.
Heading Font Sizes
Heading Font Size for H1
Heading Font Size for H2
Heading Font Size for H3
Heading Font Size for H4
Heading Font Size for H5
Heading Font Size for H6
Feature Font Sizes
Font Line Heights
Heading Font Line Height for H1
Heading Font Line Height for H2
Heading Font Line Height for H3
Heading Font Line Height for H4
Heading Font Line Height for H5
Heading Font Line Height for H6
Body Font Line Height
Secondary Menu Line Height
Font Letter Spacing
Under the Typography tab, you can also adjust the Top and Bottom margins of H1 to H6 headings. These options are especially useful if you’d like to manually tweak your headings to fit your website better. Take note that these options accept em units instead of pixel units.