Loading...

Google Fonts

Google fonts are a sensitive topic when it comes to GDPR.

If I use Google fonts on my site via the Google server, I have to describe this in my privacy policy. Furthermore, nobody knows whether and how Google tracks data via its fonts.

The safest option is to install Google Fonts locally in my theme. There is a great free online-tool for this: The google-webfonts-helper, which makes it incredibly easy to install these fonts safely.

Install fonts

Example Montserrat

  1. Open google-webfonts-helper
  2. Search for “Montserrat” and choose the styles “regular” and “700”
  3. Copy the generated CSS and paste it in the child-theme /css/custom.css.
  4. Go back to google-webfonts-helper, scroll down and download the package
  5. Unzip montserrat-v14-latin.zip and store files in folder /fonts in child-theme
  6. Font is now installed and can be used

Use

If you have already referenced the fonts in your own bootstrap.min.css, you do not need to do this. If not, you must to override the bootstrap fonts with !important rule.

body {
	font-family: 'Montserrat', sans-serif !important;
}

.h1, .h2, .h3, .h4, .h5, .h6, h1, h2, h3, h4, h5, h6 {
    font-weight: 700 !important;
}

Leave a Comment

Cookies help us deliver our services. By using our services, you agree to our use of cookies. More Information