[Fonts] Raplace Google fonts in the Semantic-UI

[zhangyuanliang]

I want to replace Google fonts in source code. What source files do I need to change, and if I want to use Lato fonts, where should I put them? I have seen a issue in particular detail before, but I can't find the address. Thanks!

[awgv]

Hi @zhangyuanliang, got your email, sorry for the delay. Were you looking for this thread? Just a reminder, you don’t have to include Cyrillic @font-face rules if you don’t need it.

[zhangyuanliang]

@Banandrew Thanks for your reply. I found the solution you gave me before in Gitter. I'll organize it for other people who need it.

[zhangyuanliang]

Detailed Steps: The only way to make it work is to override what SUI does by default, so if you’re delivering SUI files to your project from a CDN, you’ll have to install the framework via NPM and npm install semantic-ui --save command. When you do, download the Lato font, open installation_folder/src/site/globals/site.variables, copy @importGoogleFonts: false; there, then follow this link, copy the @font-face rules to installation_folder/src/site/globals/site.overrides and rebuild the framework. Place the downloaded fonts relative to semantic.min.css that you’ll be using, see the @font-face rules for reference.
These @font-face rules include only Cyrillic and Latin unicode ranges, so you might need to add @font-face rules for your country language, or delete Cyrillic @font-face rules if you don’t need it.

[jlukic]

Hi, thanks for posting, unfortunately although your question is valid, this is a usage question, and not appropriate for posting on GitHub Issues.

To help make this board manageable for maintainers to effectively work on actionable changes to the library, we've limited posts on this board to specific bug reports or feature requests. To see how we differentiate between the two, please check out our Contributing Guide.

To help get answers to your question (or get feedback that might allow you to repost this issue) you might want to check out one of our other support resources.

• StackOverflow
• Our Gitter chatroom.