Home › Forums › Support › Different fonts for different languages – but not using any multilingual plugin
- This topic has 5 replies, 3 voices, and was last updated 3 years, 3 months ago by
Tom.
-
AuthorPosts
-
September 28, 2019 at 2:52 am #1021123
Rachel
Hi,
I have a website with both English and Chinese font in the same paragraph and I’d like to use a different font for each language. I wanted Nunito for English and NotoSans for Chinese. I’ve been trying the following in my CSS:
@font-face { font-family: 'NotoSans'; src: url('fonts/chinese/NotoSansCJKtc-Thin.otf') format('opentype'); font-weight: 200; unicode-range: U+4E00-U+9FFF, U+3400-U+4DBF, U+2B740–U+2B81F; /* CJK unicode */ }
with also –
body { font-family: "NotoSans", "Nunito"; }
But everything just defaults to NotoSans…
then I tried to update that to:
body { font-family: "NotoSans", inherit; }
and everything defaults to Nunito.
Any suggestions besides wrapping certain text blocks in a span?
September 28, 2019 at 9:42 am #1021364Tom
Lead DeveloperLead DeveloperHmm, wrapping certain text in a
<span>
element is the only way I can think of, but I don’t have a huge amount of experience with multilingual sites.I don’t think it’s possible to do it the way you’re outlining above. The one font you’re using would need to support both languages.
Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/
Ongoing Development: https://generatepress.com/ongoing-developmentSeptember 28, 2019 at 11:11 pm #1021618Rachel
Thanks, Tom.
Is it possible to remove the Google Font Nunito from WordPress (one that appears in Customizer) and replace it with with a local version of it? Both Noto Sans and Nunito support both languages so I’m wondering if I could uploaded a version with just Latin glyph?
September 29, 2019 at 4:37 am #1021720David
StaffCustomer SupportHi there,
yes you can serve the fonts locally – this article explains:
https://docs.generatepress.com/article/adding-local-fonts/
Just a though considering Nunito supports both languages, then maybe try serving both of them locally and setting separate unicode-ranges for each
Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/October 28, 2019 at 10:33 am #1047033Rachel
Hi David,
Came back to work on your idea – I’m slowly working through it (had a big break..). Thank you for the suggestion. Would it be possible to add a fallback font to it? Like it to fallback to generic Sans-Serif, for example.
PS noticed on site this is made from Vancouver Island?! Where??
October 28, 2019 at 4:10 pm #1047297Tom
Lead DeveloperLead DeveloperYou should be able to add the fallback into the
@font-face
reference, and in the PHP filter (so they match).We’re based in Victoria 🙂
Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/
Ongoing Development: https://generatepress.com/ongoing-development -
AuthorPosts
- You must be logged in to reply to this topic.