@Font-Face Not Working on Wordpress Site

@font-face somehow not working

Your css is working but maybe WordPress is overriding it. Try putting !important next to the name of the font.

Example:

#man_translated {
    font-size: 26px;
    font-style: italic;
    line-height: 28px;
    font-family: chunkfiveregular !important;
}

or you could also use relative links. Instead of putting http://careerteam.de/wp-content/themes/theme1383/css/chunkfive-webfont.eot, Get rid of http://careerteam.de/ and make it like this:

url('wp-content/themes/theme1383/css/chunkfive-webfont.eot');

Fiddle

@font-face won't display custom fonts in WordPress

Try replacing the local path to your font with the complete URL, so change fonts/INDUBITA-webfont.woff to http://www.example.com/wp-content/themes/hestia/fonts/INDUBITA-webfont.woff (changing example.com to your correct domain, of course.

Fonts not rendering on wordpress site

You have a path issue for the font file, please check it in the console window. and change your path/url in your style/css.

/* If css and fonts are in same folder*/
@font-face {
    font-family: "CustomFont";
    src: url('CustomFont.ttf');
}

/* If fonts is outside of your css folder*/
@font-face {
    font-family: "CustomFont";
    src: url('../CustomFont.ttf');
}

/* Absolute static path of fonts file*/
@font-face {
    font-family: "CustomFont";
    src: url('file:///C:/Users/Administrator/fonts/CustomFont.ttf');
}

/* Url path of fonts file*/
@font-face {
    font-family: "CustomFont";
    src: url('http://localhost/wordpress/Your-font-folder-path/CustomFont.ttf');
}

Hope it helps.

@font-face not working, cannot add custom font to a website

If you inspect console you may notice two things:

1)

Failed to load resource: the server responded with a status of 404
(Not Found)

And 2)

If you open the folder structure in the sources tab, you will not find the font file like you do with stylesheet.css file (hence the 404 error).

You are targeting the text correctly. I just don't think your file is in the correct folder. Re-visit exactly where you placed the files. Is it possible that instead of the wowtheme folder, you placed them both in the default wordpress theme folder by mistake?

@font-face is not working in Wordpress theme

Maybe I'm misreading what you wrote, but I don't think you can have php code in your css file. Try moving your second code block into your theme's header.php file, wrapped in <style> tags.

Alternately, you could upload your fonts folder to the root of your site and use site-absolute paths, like so:

src: url('/fonts/MaidenOrange-webfont.eot');

---

Related Topics