# Once more: Problems with locally hosted Google fonts

**URL:** <https://discourse.gohugo.io/t/once-more-problems-with-locally-hosted-google-fonts/41340>\
**Category:** support\
**Created:** [November 7, 2022, 9:36pm UTC](https://discourse.gohugo.io/t/once-more-problems-with-locally-hosted-google-fonts/41340 "2022-11-07T21:36:22Z")\
**Posts on this page:** 20\
**Page:** 1

<div class="post-metadata">

**Author:** ![berni51](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.gohugo.io/berni51/32/18138_2.png) [@berni51](https://discourse.gohugo.io/u/berni51)\
**Post date:** [November 7, 2022, 9:36pm UTC](https://discourse.gohugo.io/t/once-more-problems-with-locally-hosted-google-fonts/41340/1 "2022-11-07T21:36:22Z")

</div>

Hi, I am Berni from Germany and new to Hugo. However I used it to built a small side with blog using the beautifulhugo theme. I like the Hugo concept very much and I’m quite satisfied with it.  
But: We may get problems in Germany with loading Google fonts from [fonts.googleapis.com](http://fonts.googleapis.com). Therefore I tried to modify my Beautifulhugo theme to load the Google fonts locally.

I followed the hints here, downloaded the fonts, put it into the local font directory and modified the font.css. Unfortunately without success: The test side “sicher3” always stated, the the fonts were loaded from [googleapis.com](http://googleapis.com).

Finally I had to change the font pathes in the index.html, which hugo creates. That worked. But where is the place in the hugo directory hirachary, where I can change these pathes permanent? It is crazy to change the index.html after each hugo run again.  
Hope, one of the cracks here can enlighten me.

Regards  
Berni

---

<div class="post-metadata">

**Author:** ![jmooring](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.gohugo.io/jmooring/32/4214_2.png) [@jmooring](https://discourse.gohugo.io/u/jmooring)\
**Post date:** [November 7, 2022, 10:43pm UTC](https://discourse.gohugo.io/t/once-more-problems-with-locally-hosted-google-fonts/41340/2 "2022-11-07T22:43:59Z")

</div>

You are more likely to receive a prompt and accurate response if you post a link to the public repository for your project.

See [https://discourse.gohugo.io/t/requesting-help/9132](https://discourse.gohugo.io/t/requesting-help/9132).

> Let us see your code
> 
> Include a **link to the source code repository** of your project, because we really need the _context_ of seeing your templates and partials to be able to help you. It is trivial to do a quick `git clone` on your repo, then run `hugo server` in your project, to help you out. On the other hand, recreating your code from screenshots, or sort of guessing at it, is not.
> 
> If you can’t share your repository for whatever reason, consider creating a dummy repo that you _can_ share, which reproduces the problem you’re experiencing.

---

<div class="post-metadata">

**Author:** ![berni51](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.gohugo.io/berni51/32/18138_2.png) [@berni51](https://discourse.gohugo.io/u/berni51)\
**Post date:** [November 8, 2022, 8:51am UTC](https://discourse.gohugo.io/t/once-more-problems-with-locally-hosted-google-fonts/41340/3 "2022-11-08T08:51:28Z")

</div>

Thanks @jmooring for your hints. The public repo is [blog.bullet500.de](http://blog.bullet500.de).

So far I don’t have a code repository and had never worked with Git. However I will read about using Git now and then create a git repo for my blog.  
Will be back soon.

Berni

---

<div class="post-metadata">

**Author:** ![chrillek](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.gohugo.io/chrillek/32/19797_2.png) [@chrillek](https://discourse.gohugo.io/u/chrillek)\
**Post date:** [November 8, 2022, 9:25am UTC](https://discourse.gohugo.io/t/once-more-problems-with-locally-hosted-google-fonts/41340/4 "2022-11-08T09:25:42Z")

</div>

The `link` elements in your header look broken, for example  
`<link rel="stylesheet" href="https://blog.bullet500.de/fonts/lora/css?family=Lora:400,700,400italic,700italic">`  
This seems to be bogus code.

On a side note: if you are “new to Hugo”, why don’t you start out with a _simple_ theme? From what I can see, you’re using a terribly bloated something with tens of CSS files, one on top of the other (KaTeX for a blog on motorcycles – why?). Fixing things is a lot easier if you follow the KISS principle. At least until you’re no longer “new to Hugo”, that is.

---

<div class="post-metadata">

**Author:** ![berni51](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.gohugo.io/berni51/32/18138_2.png) [@berni51](https://discourse.gohugo.io/u/berni51)\
**Post date:** [November 8, 2022, 10:51am UTC](https://discourse.gohugo.io/t/once-more-problems-with-locally-hosted-google-fonts/41340/5 "2022-11-08T10:51:53Z")

</div>

Before this link element pointed to the Google font page and I simpliy changed it to point to a local font directory. That works, but may be not a proper solution. Why do you thinks, it is broken?

I did’nt know tha Beautifulhgo is a is a complicated or even bloated theme. It looked so simple and clear for me. May you recommend a suitable, nice & easy theme?  
Berni

---

<div class="post-metadata">

**Author:** ![chrillek](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.gohugo.io/chrillek/32/19797_2.png) [@chrillek](https://discourse.gohugo.io/u/chrillek)\
**Post date:** [November 8, 2022, 11:31am UTC](https://discourse.gohugo.io/t/once-more-problems-with-locally-hosted-google-fonts/41340/6 "2022-11-08T11:31:59Z")

</div>

> [@berni51](#):
>
> I simpliy changed it to point to a local font directory

`<link rel="stylesheet" href="https://blog.bullet500.de/fonts/lora/css?family=Lora:400,700,400italic,700italic">` doesn’t point to anything useful. Much less is the browser loading your local fonts.

Load your page in your favorite browser, open its developer tools and have a look at the error messages. I see this:  
`GET https://blog.bullet500.de/fonts/lora/css?family=Lora:400,700,400italic,700italic [HTTP/1.1 404 Not Found 78ms]`  
Perhaps you mean to load `lora.css` or something else. Since you don’t show your code, we can’t know. In any case, a stylesheet link must point to a stylesheet, and you can’t pass font names to a stylesheet, either.

**Edit** : Now I see where that’s coming from: The Google Font API call `https://fonts.googleapis.com/css?family=Lora:400,700,400italic,700italic`. That is something else entirely - they have their own endpoint that does something intelligent with the query string. You don’t have that on your server. So you must provide a correct CSS for that.  
BTW: One of the last issues of c’t magazine (you’re in Germany, right?) talked lenghtily about substituting Google fonts with locally hosted ones.

> [@berni51](#):
>
> I did’nt know tha Beautifulhgo is a is a complicated or even bloated theme

Have a look at the number of stylesheets loaded (again, in your favorite browser’s developer tools). Personally, I don’t really care much for themes and rather build my own. Then I at least _know_ what’s going on and who’s responsible. And I can fix stuff myself.

---

<div class="post-metadata">

**Author:** ![berni51](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.gohugo.io/berni51/32/18138_2.png) [@berni51](https://discourse.gohugo.io/u/berni51)\
**Post date:** [November 8, 2022, 1:06pm UTC](https://discourse.gohugo.io/t/once-more-problems-with-locally-hosted-google-fonts/41340/7 "2022-11-08T13:06:56Z")

</div>

Puh - sounds heavy to me. I understand that the local fonts never would be loaded - but the google fonts on the google server also not. That was a first step to cut my blog from Google.

I tried to share my code on Github, but I failed. Firstly I created a new git repository and than tried to push my local hugo directory to that repo. No chance, because a simple login with username & password is no longer supported by Git. So at first I have to solve this problem. Thats to so easy for me, as I am not aprogrammer or experienced github user.

Building my own theme may be nice, but I wanted a quick & dirty blog -nothing else. 🙂

Unfortunately I missed the ct magazine with the article about Google fonts, but will try to read it online.  
Meanwile I work on my Github account.

Berni

---

<div class="post-metadata">

**Author:** ![chrillek](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.gohugo.io/chrillek/32/19797_2.png) [@chrillek](https://discourse.gohugo.io/u/chrillek)\
**Post date:** [November 8, 2022, 1:29pm UTC](https://discourse.gohugo.io/t/once-more-problems-with-locally-hosted-google-fonts/41340/8 "2022-11-08T13:29:16Z")

</div>

> [@berni51](#):
>
> but the google fonts on the google server also no

At least in the site you linked to here they were indeed loaded.

---

<div class="post-metadata">

**Author:** ![berni51](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.gohugo.io/berni51/32/18138_2.png) [@berni51](https://discourse.gohugo.io/u/berni51)\
**Post date:** [November 8, 2022, 1:41pm UTC](https://discourse.gohugo.io/t/once-more-problems-with-locally-hosted-google-fonts/41340/9 "2022-11-08T13:41:57Z")

</div>

Where did you see this? 😲

---

<div class="post-metadata">

**Author:** ![nternetinspired](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.gohugo.io/nternetinspired/32/19706_2.png) [@nternetinspired](https://discourse.gohugo.io/u/nternetinspired)\
**Post date:** [November 8, 2022, 1:52pm UTC](https://discourse.gohugo.io/t/once-more-problems-with-locally-hosted-google-fonts/41340/10 "2022-11-08T13:52:38Z")

</div>

Your css import is not correct for self-hosted fonts, you need to use a @font-face declaration.

Try the [Google Webfonts Helper](https://google-webfonts-helper.herokuapp.com/fonts), it will give you the correct webfont file formats and the correct css to use to import them. Just adjust the path in the css examples to point to the actual location you place the font-files in your Hugo project. I’d recommend only taking the css for modern browsers.

---

<div class="post-metadata">

**Author:** ![nternetinspired](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.gohugo.io/nternetinspired/32/19706_2.png) [@nternetinspired](https://discourse.gohugo.io/u/nternetinspired)\
**Post date:** [November 8, 2022, 1:54pm UTC](https://discourse.gohugo.io/t/once-more-problems-with-locally-hosted-google-fonts/41340/11 "2022-11-08T13:54:16Z")

</div>

No, they are not.  
 ![Screenshot 2022-11-08 at 13.53.35](https://canada1.discourse-cdn.com/flex036/uploads/gohugo/original/3X/b/a/bae926a6940f689e53516e9bb9209bc82d32df5a.png)

---

<div class="post-metadata">

**Author:** ![berni51](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.gohugo.io/berni51/32/18138_2.png) [@berni51](https://discourse.gohugo.io/u/berni51)\
**Post date:** [November 8, 2022, 2:36pm UTC](https://discourse.gohugo.io/t/once-more-problems-with-locally-hosted-google-fonts/41340/12 "2022-11-08T14:36:05Z")

</div>

Hmmh, I used the Google Webfonts Helper and pasted their webfile formats into my local fonts.css. Looks like I made a lot of mistakes.

During last hour I doublecheckes some themes and ended at the PaperMod theme (made by jmooring). Looks fine for me and does not load fonts from the Google website. Would you kindly check this under above link?  
Berni

---

<div class="post-metadata">

**Author:** ![chrillek](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.gohugo.io/chrillek/32/19797_2.png) [@chrillek](https://discourse.gohugo.io/u/chrillek)\
**Post date:** [November 8, 2022, 2:52pm UTC](https://discourse.gohugo.io/t/once-more-problems-with-locally-hosted-google-fonts/41340/13 "2022-11-08T14:52:35Z")

</div>

AFAICS, the fonts are not loaded from Google. But now you’re simply using Apple’s default font (or rather: I’m since I’m on macOS):  
` font-family:-apple-system,BlinkMacSystemFont,segoe ui,Roboto,Oxygen,Ubuntu,Cantarell,open sans,helvetica neue,sans-serif;`  
If that’s what you want, it is fine. Otherwise, you might want to modify the font definitions.

But: All this is not related to Hugo. It’s about CSS and using local fonts.

---

<div class="post-metadata">

**Author:** ![nternetinspired](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.gohugo.io/nternetinspired/32/19706_2.png) [@nternetinspired](https://discourse.gohugo.io/u/nternetinspired)\
**Post date:** [November 9, 2022, 10:56pm UTC](https://discourse.gohugo.io/t/once-more-problems-with-locally-hosted-google-fonts/41340/14 "2022-11-09T22:56:24Z")

</div>

I don’t see any @font-face declaration in your css, so the font files are not loading. If you don’t know css then you maybe should just stick with Google’s recommended font-loading method and not worry to much about the GDPR issues.

---

<div class="post-metadata">

**Author:** ![nternetinspired](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.gohugo.io/nternetinspired/32/19706_2.png) [@nternetinspired](https://discourse.gohugo.io/u/nternetinspired)\
**Post date:** [November 9, 2022, 10:57pm UTC](https://discourse.gohugo.io/t/once-more-problems-with-locally-hosted-google-fonts/41340/15 "2022-11-09T22:57:34Z")

</div>

As @jmooring already pointed out, it is almost impossible to help you without seeing your respository.

---

<div class="post-metadata">

**Author:** ![berni51](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.gohugo.io/berni51/32/18138_2.png) [@berni51](https://discourse.gohugo.io/u/berni51)\
**Post date:** [November 10, 2022, 8:02am UTC](https://discourse.gohugo.io/t/once-more-problems-with-locally-hosted-google-fonts/41340/16 "2022-11-10T08:02:53Z")

</div>

Sorry, but I’m still not able to push my project to the Github repo. 😫  
Therefore I copied the files form my themes/beautifulhugo/static/css to Github. I (only) guess that here is the problem.  
This is the link: [Github](https://github.com/berni51/hugo-scooter-blog)

Berni

---

<div class="post-metadata">

**Author:** ![chrillek](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.gohugo.io/chrillek/32/19797_2.png) [@chrillek](https://discourse.gohugo.io/u/chrillek)\
**Post date:** [November 10, 2022, 8:27am UTC](https://discourse.gohugo.io/t/once-more-problems-with-locally-hosted-google-fonts/41340/17 "2022-11-10T08:27:18Z")

</div>

> [@nternetinspired](#):
>
> not worry to much about the GDPR issues.

Bad advice, especially for a German website. We have lawyers (or rather hawks) charging people for this violation, i.e. usage of Google-hosted fonts.

---

<div class="post-metadata">

**Author:** ![berni51](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.gohugo.io/berni51/32/18138_2.png) [@berni51](https://discourse.gohugo.io/u/berni51)\
**Post date:** [November 10, 2022, 9:44am UTC](https://discourse.gohugo.io/t/once-more-problems-with-locally-hosted-google-fonts/41340/18 "2022-11-10T09:44:29Z")

</div>

Yepp, that’s the reason why I want to stop loading fonts from the Google website: Bloody lawyers.

---

<div class="post-metadata">

**Author:** ![tut](https://avatars.discourse-cdn.com/v4/letter/t/e95f7d/32.png) [@tut](https://discourse.gohugo.io/u/tut)\
**Post date:** [November 10, 2022, 11:06am UTC](https://discourse.gohugo.io/t/once-more-problems-with-locally-hosted-google-fonts/41340/19 "2022-11-10T11:06:03Z")

</div>

> [@berni51](#):
>
> Sorry, but I’m still not able to push my project to the Github repo.

> **[Set up Git - GitHub Docs](https://docs.github.com/en/get-started/quickstart/set-up-git)**
>
> At the heart of GitHub is an open-source version control system (VCS) called Git. Git is responsible for everything GitHub-related that happens locally on your computer.

---

<div class="post-metadata">

**Author:** ![nternetinspired](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.gohugo.io/nternetinspired/32/19706_2.png) [@nternetinspired](https://discourse.gohugo.io/u/nternetinspired)\
**Post date:** [November 10, 2022, 12:37pm UTC](https://discourse.gohugo.io/t/once-more-problems-with-locally-hosted-google-fonts/41340/20 "2022-11-10T12:37:38Z")

</div>

Yes, I am aware of that. In this case then the options are:

1. Learn to css, or;
2. Don’t use Google fonts.

As already identified, _this is not a Hugo issue_.

[Next page](https://discourse.gohugo.io/t/once-more-problems-with-locally-hosted-google-fonts/41340.md?page=2)