elementor
elementor copied to clipboard
elementor
🔃 🔗 🚀 Feature Request: TRULY prevent Google Fonts from Loading (Related to #4544, #17835)
Prerequisites
- [X] I have searched for similar features requests in both open and closed tickets and cannot find a duplicate.
- [X] 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.
As I am working with local fonts due to GDPR I have searched information on Elementor and Google Fonts. I find that even if not used Google Fonts are loaded (even if unchecking the box for using default fonts).
My request is both due to GDPR and performance improvement.
I know there is a php-code that can be used but then I need to create a child-theme and I think that this feature should be easier to add to Elementor via a setting, or a PHG-widget.
Describe the solution you'd like
I want via the Elementor settings, to TRULY prevent Google Fonts to load - to TRULY not be involved on my site.
Describe alternatives you've considered
Settings in Elementor Widget in Elementor for php
Additional context
No response
How to Speed Up a Slow Site With Elementor
add_filter( 'elementor/frontend/print_google_fonts', '__return_false' );
Yes I know. But that should be in a child theme's php-file. I am asking for a setting in Elementor or even preferably a php-widget.
+1 I'm currently using code to resolve this issue. But it would be great if elementor adds the ability to disable Google fonts.
While, yes, it would be good to be able to completely disable Google Fonts from being loaded via the Elementor UI/settings, you don't actually have to use a child-theme at all in order to run custom PHP code on your site.
All you need is to add the above PHP filter inside a new .php file with any name and just put it inside /wp-content/mu-plugins
Any .php file inside the mu-plugins folder is always executed, and you can see your currently loaded MU Plugins in /wp-admin/plugins.php?plugin_status=mustuse
No need for the custom php code, don't have any Google Fonts loaded in Elementor. Make sure to go to the global font settings and set the fonts to a local font (instead of e.g. Roboto); then it works fine for me.
Theme Astra, Elementor (free) and using https://de.wordpress.org/plugins/custom-fonts/ for the local fonts
While, yes, it would be good to be able to completely disable Google Fonts from being loaded via the Elementor UI/settings, you don't actually have to use a child-theme at all in order to run custom PHP code on your site.
All you need is to add the above PHP filter inside a new .php file with any name and just put it inside /wp-content/mu-plugins
Any .php file inside the mu-plugins folder is always executed, and you can see your currently loaded MU Plugins in /wp-admin/plugins.php?plugin_status=mustuse
Well I actually would according to Elementor if I do not want the theme to override the file each time the theme is updated.
No need for the custom php code, don't have any Google Fonts loaded in Elementor. Make sure to go to the global font settings and set the fonts to a local font (instead of e.g. Roboto); then it works fine for me.
Theme Astra, Elementor (free) and using https://de.wordpress.org/plugins/custom-fonts/ for the local fonts
Great it worked fine for you :) . I just know some had issues with Google Fonts loading in the background even if not using it. Perhaps they did not disable the setting for Roboto. I will test on my dev-site and inspect what is loaded. I "just" need to install the fonts AND connect them to my global fonts. ;)
I've they didn't switch from Roboto to a local font then you would need to block it with the php code above. But it is way easier to change it in the settings.
I've they didn't switch from Roboto to a local font then you would need to block it with the php code above. But it is way easier to change it in the settings.
ok. I thought they hade the problem anyhow..that is how I read it but I am very happy if that is not the case. I am testing right now so I will see. :)
ok. I thought they hade the problem anyhow..that is how I read it but I am very happy if that is not the case. I am testing right now so I will see. :)
Installing a plugin just to remove Google fonts does not make sense.
ok. I thought they hade the problem anyhow..that is how I read it but I am very happy if that is not the case. I am testing right now so I will see. :)
Installing a plugin just to remove Google fonts does not make sense.
again: not needed. You just select local fonts in the font settings and disable it in the Elementor settings.
again: not needed. You just select local fonts in the font settings and disable it in the Elementor settings.
Are inactive. But Google fonts are still displayed in the gt metrix. Am I wrong? Please send a screenshot of the desired settings.
@79ho3ein which font is loaded? Which theme are you using? Which plugins are you using...many options that could load the fonts. Can't make you a screenshot...go to the global font settings and assign a local font for primary, secondary, text, accent. And to check it just use the DevTools and check the network tab to see if there is a call to Google. No need to do a gtmetrix scan all the time.
@m1ga I use hello elementor. These fonts are loaded : https://prnt.sc/Eb__53Eq8f1Y And I delete them using this code.
add_filter( 'elementor/frontend/print_google_fonts', '__return_false' );
@79ho3ein that doesn't really help :smile: ~~If you didn't use Elementor it would be a strange place to ask for help~~ :wink: edit: sorry, didn't see you've meant "Hello Elementor" theme!
As said before, use the DevTools:
it will show you which font it is.
Then make sure you don't use those three fonts in your page e.g. what did you set your global fonts too?
Also make sure that other plugins or your theme doesn't import those fonts. Doesn't have to be Elementor. Can you share the URL?
Did a test with "Hello Elementor" and I don't have any Google Fonts their either
@m1ga
No need for the custom php code, don't have any Google Fonts loaded in Elementor. Make sure to go to the global font settings and set the fonts to a local font (instead of e.g. Roboto); then it works fine for me.
Yes, you can prevent this behaviour by disabling the Elementor Roboto in the default typo settings, but it doesn't mean that there's not a single reason for Roboto to be there in the first place.
And it worth mentioning that this is a known problem, which has been here in different incarnations since 2018 (#4075, #16023, #13714). With not much of a attention from the devs. As usual, I must say. Unfortunatelly.
@black-eye agree that it doesn't have to be there. There is a PR https://github.com/elementor/elementor/pull/17835 that sounds promissing to get rid of those issues. I just wanted to point out that you can get rid of that without using the php code above because it seems like some users have issues with that
@m1ga
@black-eye agree that it doesn't have to be there. There is a PR #17835 that sounds promissing to get rid of those issues. I just wanted to point out that you can get rid of that without using the php code above because it seems like some users have issues with that
Yes, sure I got your point and I'm glad you have mentioned the solution here. I just wanted to point out, that the root of the problem is elsewhere. In other words, we are fixing something that shouldn't be there at all.
The only positive thing is, that at least, there's a way we can do it. The main problem of this issue is, that most of the users are not aware of it, and part of those who are, are unable to solve it (again, good you have mentioned the solution here).
Concerning the PR for self loading Google fonts: well, self loading is a bit different problem. If not used, we don't want to load the Roboto font at all, no matter wheather self hosted or from Google, right?
Concerning the PR for self loading Google fonts: well, self loading is a bit different problem. If not used, we don't want to load the Roboto font at all, no matter wheather self hosted or from Google, right?
Yes and no. If it is self-hosted at least its not a GDPR issue as described in the original question, no external request. Of course it would be better to not add it at all if it is not needed. We'll see and find out how they go on with the PR (docs are not up yet).
But going back to @79ho3ein : did it work for you?
@m1ga
No Google font is loaded when I view my home screen using inspact. But in gt metrix fonts are still displayed. I do not know exactly where they are loaded. But when I use the code suggested by elementor to remove Google fonts, Google fonts are even removed from gt metrx.
Then just stick with the code if that works for you. You can use something like https://wordpress.org/plugins/disable-remove-google-fonts/ too (was the first hit in the plugin directory) if you don't want to add the code yourself in every project.
For me it just works as described earlier in multiple projects. As mentioned above too: could be some other plugin you are using (e.g. caching).
Did a test with "Hello Elementor" and I don't have any Google Fonts their either
Perfmatters would be the automated way to either disable google fonts, or host the ones you're using locally
Friends, I checked this and came to the conclusion that elementor does not load Google fonts except in certain circumstances. If in Site Settings > Global Fonts, the default fonts are set to Google Fonts, Google Fonts will be loaded. Otherwise, Google fonts will not load. Therefore, be sure to set the default fonts in the site settings to your own custom fonts, so that Google fonts are not loaded.
Would it be possible to add an option to store all Google Fonts used on the site locally? So, when the page is loaded, on the front end, all fonts are pulled from the site instead of Google CDN.
@srcek you can do that by hand already with https://wordpress.org/plugins/custom-fonts/ and select the local fonts in Elementor.
I think would be very difficult to do it automatically since you have to do it when you select the font for every element. And then you have to remove it again if you select a different font (and keep it when you have another page that is using a label with that font). Very difficult to implement. Since you should know which fonts you want to use in your whole page it is very easy to use the plugin above and then select them in your font selection
@m1ga I'm aware that there are plugins to do that. Also, I know that you can download fonts and add them to the site manually via Elementor. But, the issue are already existing sites. I'm not asking for the editor itself to stores everything locally. While editing everything stays the same and you use Google CDN for preview. Local caching mechanism could be activated only on the front end (not in the editor).