I have downloaded a Google web font (Poppins) and converted it to the necessary @font-face formats (.woff, .woff2, .eot, .svg, .otf). I have placed these files locally on my Wordpress site in development on a localhost Mamp site.

Now, when I do the normal @font-face declaration, the font only shows on the localhost website if the font is installed in Font Book on my mac (i.e. in my system fonts).

This worries me, because it shows my code is correct (i.e. font-family: 'Poppins-Regular';) but it seems to be calling the font from Font Book (my system fonts) and not the local files in my Wordpress site. I've tested another non-google font and it works fine without it being in Font Book on my mac, so I know the files are in the correct location etc. I can't work out why this is only happening with the google font.

The site in development is going to be both a website and also a different version as an intranet site. The intranet site won't have access to the internet so I will need to host the font files locally on the Wordpress site.

Can I take it that when I upload the site to a web server everything will show OK? And why do I need the font file on my mac for it to show with a @font-face declaration.

I'm very confused.

Emily.

  • This does not sound WordPress related, but where did you place the dont files in your site? For the non-google font you tested, where were those files located? Can you edit your question to include the css for both font calls? And is there a reason you do not want to use the font hosted by Google? – czerspalace Oct 21 '16 at 23:38
  • I've just solved the problem. I needed to enqueue another stylesheet into in my functions.php file because the poppins font was in a different folder with it's own CSS file. – The Chewy Oct 21 '16 at 23:50

I've just solved the problem.

I needed to enqueue another stylesheet into in my functions.php file because the poppins font was in a different folder with it's own CSS file.

Your Answer

 
discard

By clicking "Post Your Answer", you acknowledge that you have read our updated terms of service, privacy policy and cookie policy, and that your continued use of the website is subject to these policies.

Not the answer you're looking for? Browse other questions tagged or ask your own question.