MagicMirror Forum
    • Recent
    • Tags
    • Unsolved
    • Solved
    • MagicMirror² Repository
    • Documentation
    • 3rd-Party-Modules
    • Donate
    • Discord
    • Register
    • Login
    A New Chapter for MagicMirror: The Community Takes the Lead
    Read the statement by Michael Teeuw here.

    Font for non-latin characters

    Scheduled Pinned Locked Moved Solved Custom CSS
    6 Posts 3 Posters 676 Views 3 Watching
    Loading More Posts
    • Oldest to Newest
    • Newest to Oldest
    • Most Votes
    Reply
    • Reply as topic
    Log in to reply
    This topic has been deleted. Only users with topic management privileges can see it.
    • M Offline
      MMRIZE @jv2007
      last edited by

      @jv2007
      Option 1 is almost right, but each font-face needs to have a different name.
      Option 2 or 3 seems something related to lang attribute. If your content has explicit lang attribute on the element, it might be work, but, as far as I understand, that might not be your thing.

      1 Reply Last reply Reply Quote 0
      • M Offline
        MMRIZE @jv2007
        last edited by MMRIZE

        @jv2007
        But, more simple way is; just use this;

        body {
          font-family: 'Open Sans Condensed', 'Noto Sans KR';
        }
        

        Open Sans Condensed font doesn’t have any Korean characters, so when the renderer meet Korean chars, the second fallback Noto Sans KR would be applied instead of Open Sans Condensed.

        5dad8c9d-2cf0-4c04-a3e7-542682a1f0d8-image.png

        1 Reply Last reply Reply Quote 1
        • karsten13K Offline
          karsten13 @jv2007
          last edited by

          @jv2007

          you can take a look at <mm-folder>/fonts/roboto.css where the mm fonts are defined

          1 Reply Last reply Reply Quote 0
          • M Offline
            MMRIZE @jv2007
            last edited by MMRIZE

            @jv2007
            If you want to use @font-face, you can use like this;

            @font-face {
              font-family: 'korean';
              src: url('./notosans.ttf') format('truetype');
              unicode-range: U+AC00-FFDD;
            }
            
            @font-face {
                font-family: 'english';
                src: url('./opensanscondensed.ttf') format('truetype');
            }
            
            div.test {
                font-family: 'korean', 'english';
            }
            

            9e04b138-2e5b-4a9b-9dcc-d087d1b2988f-image.png

            1 Reply Last reply Reply Quote 0
            • J Offline
              jv2007
              last edited by

              Thanks @MMRIZE and @karsten13 !

              I have tried following your instructions but it didn’t help.
              I figured out it’s hidden in the modules css-file. I should have thought about that beforehand.
              When I change the font as suggested by @MMRIZE to set as

              font-family: 'Open Sans Condensed', 'Noto Sans KR';
              

              It works now.

              Thanks guys!
              Case closed!

              1 Reply Last reply Reply Quote 0
              • J jv2007 marked this topic as a question on
              • J jv2007 has marked this topic as solved on
              • 1 / 1
              • First post
                Last post
              Enjoying MagicMirror? Please consider a donation!
              MagicMirror created by Michael Teeuw.
              Forum managed by Sam, technical setup by Karsten.
              This forum is using NodeBB as its core | Contributors
              Contact | Privacy Policy