Many of our users like to self host their own fonts for performance, security and privacy reasons. But keep in mind self hosting web fonts can be difficult. We still recommend using Google fonts unless you have specific needs to host your own font.
We found this online tool useful to generate font files and @font-face code from Google fonts - https://google-webfonts-helper.herokuapp.com/fonts/lato?subsets=latin
Download the font files and place them inside themes/hugo-advance/static/fonts/custom/lato-v23-latin-regular.woff
Copy the @font-face code snippets into the themes/hugo-advance/assets/scss/fonts/custom-font.scss file.
Make sure the @font-face url path correctly maps to the custom fonts folder, ie url('../../fonts/custom/lato-v23-latin-regular.woff')
open the config.toml and set google_fonts: false
[params.fonts]
google_fonts = false
...
There are many ways to generate the @font-face code, this is not something the theme can be preconfigured for. Sometimes the code is provided with the webfont zip file when you purchase a font. Other times you will need to generate it yourself using a 3rd party service or writing it by hand.
If you are using the google fonts helper that we recommened at the start, it will generate the @font-face code.
Designed and built by Rob Austin @ausrobdev in Brisbane, Australia. We stand on the shoulders of giants: Hugo | Jekyll