CORS Error for fonts after changing domain

  • Hey there,

    I’m using the twenty-twenty-four theme with a child theme (it’s still blank) and got the following problem.

    I was working on the page, installed fonts via FSE and google fonts.

    Then I changed the domain from non-www to www through the database.

    So basically from

    https://example.com

    to

    https://www.example.com

    Now I get an CORS error because in the CSS that gets inserted into the <head>, the old non-www domain is referenced.

    So it currently says something like:

    @font-face{font-family:Outfit;font-style:normal;font-weight:100;font-display:fallback;src:url(‘https://example.com/wp-content/uploads/fonts/QGYyz_MVcBeNP4NjuGObqx1XmO1I4TC0C4S-EiAou6Y.woff2&#8217;) format(‘woff2’);}

    instead of

    @font-face{font-family:Outfit;font-style:normal;font-weight:100;font-display:fallback;src:url(‘https://www.example.com/wp-content/uploads/fonts/QGYyz_MVcBeNP4NjuGObqx1XmO1I4TC0C4S-EiAou6Y.woff2′) format(‘woff2’);}

    How can I actually change/update the path? I figured this doesn’t work through the database.

    So right now I’m working with a workaround…

    function replace_font_urls_in_css_output() {
    ob_start(function ($buffer) {
    // Replace non-www URLs with www URLs in the CSS output
    return str_replace(‘https://example.com&#8217;, ‘https://www.example.com&#8217;, $buffer);
    });
    }

    // Start output buffering before content is sent to the browser
    add_action(‘wp_head’, ‘replace_font_urls_in_css_output’, 1);
    add_action(‘wp_footer’, ‘replace_font_urls_in_css_output’, 1);

    Any idea, if there’s a native way to update the font path as well?

    Cheers
    Wolf

  • You must be logged in to reply to this topic.

Tags