Many websites use Google Fonts to enhance their typography. Loading these fonts directly from Google’s servers can lead to two challenges:
- Performance impact: Each request to Google’s servers adds extra load time, slowing down your site.
- Privacy concerns: GDPR and other data protection laws may restrict the transfer of user information to Google, complicating compliance.
To address these issues, Elementor includes the Load Google Fonts Locally feature, which lets your site serve fonts directly from your own server instead of Google’s CDN.
Benefits of Loading Google Fonts Locally
There are several advantages to activating this feature:
Improved Performance
Fonts are served from your server instead of an external CDN. This reduces page load times and improves site speed, especially for visitors in regions with slower connections to Google’s servers.
Enhanced Privacy & Compliance
Since no font requests are made to Google, no user data is shared externally. This makes it easier to comply with GDPR and other privacy regulations.
Automatic Management
Elementor automatically downloads the fonts in use and stores them in your site’s /wp-content/uploads/elementor/fonts/ folder. It also updates your site’s CSS to point to the local files, ensuring a smooth and transparent experience.
Enable or Disable Load Google Fonts Locally
1. Go to the WP Admin.
2. Navigate to Elementor > Settings and click the Performance tab.
4. Scroll down to the Load Google Fonts Locally section.
5. Select one of the following:
- Enable: Serve fonts from your server
- Disable: Load fonts directly from Google’s CDN
6. Click Save Changes.
How Loading Fonts Locally works behind the scenes
- Font Detection: Elementor scans your pages for Google Fonts in use.
- Automatic Download: The required font files are downloaded and stored locally on your server.
- Updated CSS: Elementor rewrites your CSS so fonts are loaded locally instead of from Google.
- Cache Handling: If your site’s cache is cleared, Elementor re-downloads the fonts automatically.
This ensures fonts are always served efficiently and securely, without extra work on your part.
Troubleshooting
If you enable this feature and notice that fonts are not appearing on your site’s frontend, please refer to this article for solutions: Fonts Not Appearing on Frontend – Troubleshooting Guide