• Recent
  • Tags
  • Unsolved
  • Solved
  • MagicMirror² Repository
  • Documentation
  • 3rd-Party-Modules
  • Donate
  • Discord
  • Register
  • Login
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.

My own fonts

Scheduled Pinned Locked Moved Solved Troubleshooting
9 Posts 3 Posters 3.4k Views 2 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.
  • S Offline
    strawberry 3.141 Project Sponsor Module Developer @zkab
    last edited by Apr 4, 2017, 4:10 PM

    @zkab you can set the font in custom.css

    Please create a github issue if you need help, so I can keep track

    1 Reply Last reply Reply Quote 1
    • Z Offline
      zkab
      last edited by Apr 4, 2017, 4:55 PM

      I have my own font ‘SHOTGUNK.TTF’ that I want to use in ‘helloworld’ … don’t figure out the syntax in custom.css

      B 1 Reply Last reply Apr 4, 2017, 5:30 PM Reply Quote 0
      • B Offline
        broberg Project Sponsor @zkab
        last edited by broberg Apr 4, 2017, 5:30 PM Apr 4, 2017, 5:30 PM

        @zkab

         @font-face {
          font-family: shotgunk;
          font-style: normal;
          font-weight: 400;
        
          src:
            local("shotgunk"),
            url("../fonts/shotgunk/SHOTGUNK.TTF") format("truetype");
        
        }
        
        1 Reply Last reply Reply Quote 1
        • Z Offline
          zkab
          last edited by Apr 4, 2017, 6:18 PM

          OK - I will place the code in custom.css but where do I store the actual font “SHOTGUNK.TTF” … in the MagicMirror/fonts subdir ?

          B 1 Reply Last reply Apr 4, 2017, 6:27 PM Reply Quote 0
          • B Offline
            broberg Project Sponsor @zkab
            last edited by Apr 4, 2017, 6:27 PM

            @zkab Yes, I placed my fonts in separate folders as well to keep it organized (doesn’t matter as long as the url in the css code goes to the font in question)

            1 Reply Last reply Reply Quote 0
            • Z Offline
              zkab
              last edited by zkab Apr 6, 2017, 5:13 PM Apr 6, 2017, 5:13 PM

              Didn’t get it right …

              What I want to do is write two textlines with ‘helloword’ - the first one with ‘upper_third’ and the second one with ‘bottom_bar’.
              Fonts should be zapfchan (‘upper_third’) and shotgunk (‘bottom_bar’) but only ‘upper_third’ is OK.
              I have place the fonts in a folder my-fonts …

              :~/MagicMirror/fonts/my_fonts $ ls -l
              total 96
              -rwxr-xr-x 1 pi pi 34276 apr 6 15:32 SHOTGUNN.TTF
              -rwxr-xr-x 1 pi pi 59964 apr 6 15:51 ZAFCHAB.TTF

              My custom.css looks like this:

              @font-face {
                font-family: zapfchan;
                font-style: normal;
                font-weight: 400;
                src:
                  local("zapfchan"),
                  url("../fonts/my_fonts/ZAFCHAB.TTF") format("truetype");
              }
              @font-face {
                font-family: shotgunk;
                font-style: normal;
                font-weight: 400;
                src:
                  local("shotgunk"),
                  url("../fonts/my_fonts/SHOTGUNK.TTF") format("truetype");
              }
              .region.upper.third .helloworld div {
              font-size: 71px;
              color: #74bbf1;
              font-family: "zapfchan";
              font-style: normal;
              }
              .region.bottom .helloworld div {
              font-size: 100px;
              color: #74bbf1;
              font-family: "shotgunk";
              font-style: normal;
              }
              
              

              Where have I missed ?

              1 Reply Last reply Reply Quote 0
              • B Offline
                broberg Project Sponsor
                last edited by Apr 6, 2017, 6:37 PM

                doublecheck your spelling, you have SHOTGUNN.TTF and SHOTGUNK.TTF … Which is the correct filename?

                1 Reply Last reply Reply Quote 0
                • Z Offline
                  zkab
                  last edited by Apr 7, 2017, 5:48 AM

                  Thanks - I didn’t saw the misspell … sorry
                  The font is SHOTGUNN.TTF and nothing else.
                  Problem is solved and thanks again.

                  1 Reply Last reply Reply Quote 0
                  • 1 / 1
                  1 / 1
                  • First post
                    6/9
                    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