✅ 🔗 Allow hosting Google Fonts locally with Elementor Pro Custom Fonts (Duplicate of #19966)

[Beardmancer]

Prerequisites

• I have searched for similar features requests in both open and closed tickets and cannot find a duplicate.
• The feature is still missing in the latest stable version of Elementor ( Elementor Pro )

What problem is your feature request going to solve? Please describe.

I want to use a font that is available from Google Fonts (Poppins), but prefer to host it locally on my server versus loading a Google script. Currently, I can't do this cleanly because any font with a name that matches a Google Font seems to be blocked from loading when Google Fonts are disabled.

Describe the solution you'd like

When I upload a Google Font like Poppins to Elementor's Custom Fonts section, the font should load on both the front end and within the editor, even when Google Fonts is disabled as a source.

Describe alternatives you've considered

Renaming the font in Elementor Pro Custom Fonts seems to allow it through. For example, I've renamed "Poppins" to "Poppins Local" and it now appears as a custom font in the editor. This is how I determined that fonts are being filtered and blocked by name rather than by source.

It does work, but it's not ideal, because now all of the styles on the front end specify "Poppins Local" as the font-family, which is a font that doesn't actually exist. I should be able to use the original font name "Poppins" without having to load it from Google's servers.

Additional context

I'm aware of some other discussion regarding this issue, linked below.

Someone else experiencing a similar issue:
https://github.com/orgs/elementor/discussions/19966

An experiment that may have been a solution to this issue, but seems to have died:
#17835

[nicholaszein]

Hello there, @Beardmancer!

Thank you for your submission! 🙏

🔗 🚀 There is already a similar request submitted by someone here #19966

Feel free to continue the conversation and cast your ⬆️ Upvote there! 👉

🔍 Please, in the future, remember to check if there isn't any thread similar to yours already opened.

Kind regards

[nicholaszein]

Hi @Beardmancer!

We have great news! 🙌

📢 We're happy to announce that Load Google Fonts Locally is now a native feature of Elementor since the release of version 3.27.0! 🥳

You can now activate the new experimental feature by going to your WordPress Dashboard > Elementor > Settings > Features page, and switching the option to Load Google Fonts locally to Active.

This will make Elementor automatically download all the weights and style files of the Google Fonts in use in the .woff2, and save them in a special folder inside the ../wp-content/uploads/ folder.

These font files are downloaded only once a page using the Google Fonts is loaded, and will be re-downloaded on every new visit after the Elementor CSS & Data is Regenerated. Fonts are only loaded when in use.

For more information see: https://elementor.com/help/load-google-fonts-locally/

In the future this feature will be merged to core and may or may not have a setting in the Elementor Settings > Performance tab.

✅ Feel free to check it out and update your plugin to the new version!

Check the changelog for more information:
Changelog of Elementor and Elementor Pro

Cheers 🥂