Die 3 besten WordPress, Divi & Elementor Bücher
- WordPress 5: Das umfassende Handbuch
- WordPress & Elementor Schritt für Schritt Anleitung
- WordPress & Divi: Anleitungen und viele Tipps
Google Fonts GDPR Update
On January 20, 2022, the district court in Munich had awarded damages for the external integration of Google Fonts. After that, the demand for the local integration of Google Fonts significantly increased, and we received several inquiries in this regard as well.
In order to meet the general demand, we decided to create a new website called Lokale Fonts. There we offer WordPress plugins with which you can load Google Fonts locally on WordPress. You will get individual, minimal WordPress plugins, each containing a combination of two different Google Fonts.
The Plugins are blocking all data calls to the Google Fonts servers as well. They come without label and there is no reference to another service provider. If you have concerns about data protection and your WordPress site, the plugin will already help you. We set up the site in such a way that only two different Google Fonts are installed locally in each WordPress plugin. This guarantees that your page is not loaded with unnecessary code and only takes as much as is necessary.
Divi Google Fonts local integration
Since the General Data Protection Regulation (GDPR), web designers have had to deal more intensively with the topic of data protection. Unfortunately, many products from American companies, e.g. the Divi theme from Elegant Themes, do not comply with German data protection regulations, as this topic does not play a major role in America.
The Divi theme integrates Google Fonts externally from Google’s servers, from the address: fonts.gstatic.com. If you want to check whether your theme or website also integrates Google Fonts externally, you can check all your external data calls on this page.
By default, you will see calls to fonts.gstatic.com with the Divi theme. The legal situation in this regard has not been fully clarified, but the fact is that in order to call up the fonts, the user’s IP must be given to Google.
This usually happens without the consent of the user. What exactly Google does with this IP is not clear, but this is an involuntary disclosure of the IP and thus offers the possibility of a warning. To be on the safe side, you should embed all fonts locally. We are now doing this using the Divi theme, but the same method can also be implemented with most other themes. Here is the description, in short, for people who want it fast.
How to embed Google Fonts locally on Divi
- Go to the Divi settings under: Divi → Theme Options → Use Google Fonts and deactivate Google Fonts there.
- Select the desired font from Google Webfonts Helper.
- Upload the font to WordPress and upload the specified CSS in an extra file.
- Integrate the CSS file in the functions.php to WordPress
- Assign the correct font to the various headings and paragraphs in the custom CSS file.
And here is the long description:
- The first point is relatively simple, you just disable the Google Fonts on WordPress.
2. Then you select the fonts you want on Google Webfonts Helper and copy the given CSS.
- You copy the CSS into a separate file and load it, e.g. into the child theme or a specially created plugin.
- The CSS must be loaded with PHP, otherwise there may be speed problems. Here is an example how to create a whole plugin for the fonts.
Finally, you can now assign the respective fonts to the various headings and paragraphs (or body text) in your own CSS file. You can see exactly how this works here.
Then you have integrated all of your fonts locally and can also check this with the webpagetest.org page.
This might seem a bit complicated at first, but once you’ve done it, you’ll know what you’re doing and can embed the fonts locally for any theme. If you still had difficulties with the implementation, you will find a faster and easier solution on our new website called Lokale Fonts. There you will find various WordPress plugins that were created exactly according to the principle of this guide. You can simply select your desired Google fonts there and these are then installed locally in the plugin and data calls to Google servers are also blocked.