help center

Search
Close this search box.
On this page

Choose a loading method for Google fonts

Last Update: February 21, 2024

Google Fonts are an open source library of fonts often used in websites. By default, Elementor uses Google fonts for website creation. The method used to load these fonts can impact website performance so Elementor offers creators several loading options. 

Note: The website CSS also contains a fallback font which is used in case Google Fonts does not load. 

To change the Google Font loading method:

  1. From WP Admin, select Elementor>Settings.

    Four tabs appear in the right pane.
  2. Select the Advanced tab.
  3. From  the Google Fonts Load dropdown menu, select a loading method.
    There are five methods you can choose from:
    • Default: Uses the browser settings to determine the loading method. 
    • Blocking: Hides the text until Google Fonts has fully loaded.
    • Swap: The text is displayed in the fallback font until Google Fonts is loaded. 
    • Fallback: – Uses the fallback font initially, then swaps it with the custom font when it’s available.
    • Optional: Similar to Auto, but the browser can choose to use a fallback font instead of waiting for Google Fonts to load.
  4. Click Save Changes.

Google Fonts will now load using the method you selected.

Have more questions? We’re more than happy to assist.

Link is copied to clipboard!
On this page

Is this article helpful?

Share this article