Font Awesome icons not rendering
-
I am putting together a site in english and french for ski race. The language is set from different domains. On the english site, everything renders as expected.
On the french site, there is an accordion block on the left side where the plus signs — that are font awesome icons — for each item in the accordion are not rendering.
When I inspect the page, I see errors about the Font Awesome font failing to load because of a violation of the CORS policy:
Access to font at 'https://candycanecup.ca/wp-content/plugins/qubely/assets/fonts/fa-solid-900.woff' from origin 'https://coupecannedenoel.ca' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.
I added:
<IfModule mod_headers.c> <FilesMatch "\.(ttf|ttc|otf|eot|woff|woff2|font.css|css|js)$"> Header set Access-Control-Allow-Origin "*" </FilesMatch> </IfModule>
…to the site’s .htaccess file in the hope that it would permit pages on the french side to access the font from the english URL, but that hasn’t worked.
How can I get french pages to reference the .woff files with the french URL or with a relative URL so that the font doesn’t get blocked?
The page I need help with: [log in to see the link]
- The topic ‘Font Awesome icons not rendering’ is closed to new replies.