0

I'm creating a custom theme and calling a font inside a theme css.

This is my functions PHP,

function load_stylesheets(){
    wp_register_style('mycss', get_template_directory_uri() . '/assets/css/mycss.css', array()
        , false, 'all');
    wp_enqueue_style('mycss');
}

add_action('wp_enqueue_scripts', 'load_stylesheets');

And in mycss.css has these fonts

@font-face {
    font-display: swap;
    font-family: "myfont";
    src: url('fonts/myfont.eot');
    src: url('fonts/myfont.eot?#iefix') format('eot'),
    url('fonts/myfont.woff2') format('woff2'),
    url('fonts/myfont.woff') format('woff'),
    url('fonts/myfont.ttf') format('truetype'),
    url('fonts/myfont.svg#icomoon') format('svg');
    font-weight: normal;
    font-style: normal;
}

And even though I have \wp-content\themes\mytheme\assets\fonts\myfont.woff2 I'm getting a not found error for the file,

net::ERR_FAILED 200

Is there a way to fix this and I need to call background images in css and hope I can apply the same fix. Sorry if this is simple but I'm bit new to wordpress.

vimuth
  • 5,064
  • 33
  • 79
  • 116
  • _"I'm getting a not found error"_ - do you really, though? `net::ERR_FAILED 200` - it says 200 here, not 404. Most likely you have a CORS problem, see https://stackoverflow.com/q/22665232/1427878 – CBroe Oct 05 '22 at 10:45

1 Answers1

2

mycss.css

@font-face {
    font-display: swap;
    font-family: "myfont";
    src: url('../fonts/myfont.eot');
    src: url('../fonts/myfont.eot?#iefix') format('eot'),
    url('../fonts/myfont.woff2') format('woff2'),
    url('../fonts/myfont.woff') format('woff'),
    url('../fonts/myfont.ttf') format('truetype'),
    url('../fonts/myfont.svg#icomoon') format('svg');
    font-weight: normal;
    font-style: normal;
}
Milad Jafari
  • 77
  • 3
  • 1
    To make this a useful answer for the StackOverflow community, please add an explanation why this will fix the issue. – FluffyKitten Oct 05 '22 at 19:16