Question

I’m trying to add a custom font to my wordpress website, but i’m not sure of what I’m doing here so if you can help me !

For the moment in my theme directory I have a font directory in which I’ve put my font.otf
My style.css is in the theme directory :

Theme

——style.css

——font

———-Museo300-Regular.otf

I’m using the compass to generate font face like this :

@include font-face("Museo300", font-files("font/Museo300-Regular.otf"));

which output me this :
@font-face {
font-family: “Museo300”;
src: url(‘fonts/font/Museo300-Regular.otf’) format(‘opentype’); }

And when I try to use it :

#headerContainer header #menu li {
  float: left;
  font-family: "Museo300";
  color: #FFF; }

But I the font doesn’t get used !

So if someone know where I’m wront !
Thanks

Answer 1

You need to do it like this, depending on your server setup. Also, never used font-files before, or compass. I use src but I’m guessing its your server path. I.e. It thinks your font is elsewhere.

@include font-face("Museo300", src("../font/Museo300-Regular.otf"));

or

@font-face {
   font-family: 'Museo300';
   src: url('../font/Museo-Regular.otf');
   font-weight: normal;
   font-style: normal;
}