If I load my website for the first time, these errors pop-ups for every font version I have installed:
Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at https://karmel.stefvanoevelen.com//wp-content/themes/blankslate/fonts/din_alternate_bold-webfont.woff2. (Reason: CORS header ‘Access-Control-Allow-Origin’ missing).
downloadable font: download failed (font-family: "Din-bold" style:normal weight:700 stretch:100 src index:1): bad URI or cross-site access not allowed source: https://karmel.stefvanoevelen.com//wp-content/themes/blankslate/fonts/din_alternate_bold-webfont.woff2
After the second reload, it works normally. Any idea how to fix this on the first visit?
In order to fix an issue for your WordPress blog, just put below into your .htaccess file.
<IfModule mod_headers.c>
<FilesMatch "\.(ttf|ttc|otf|eot|woff|woff2|font.css|css|js)$">
Header set Access-Control-Allow-Origin "*"
</FilesMatch>
</IfModule>
As you see Access-Control-Allow-Origin "*" allows you to access all resources and webfonts from all domains.