Access to font at from origin has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource

Question

I have two problems in my website:

1) Mixed Content: The page at 'https://www.mywebsite.com/' was loaded over HTTPS, but requested an insecure font 'http://demo.kallyas.net/ares-furniture-interior-design/wp-content/uploads/sites/6/2016/03/montserrat-light-webfont.woff'. This content should also be served over HTTPS.

2) Access to font at 'https://kallyas.net/demo-ares/furniture/wp-content/uploads/sites/6/2016/03/montserrat-light-webfont.woff' from origin 'https://www.mywebsite.com' has been blocked by CORS policy:

No 'Access-Control-Allow-Origin' header is present on the requested resource.

I have tried:

<IfModule mod_rewrite.c>
Header set Access-Control-Allow-Origin "*"
RewriteEngine On
RewriteBase /
RewriteRule ^index\.php$ - [L]
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule . /index.php [L]
</IfModule>

&

Header set Access-Control-Allow-Origin "*"
Header set Access-Control-Allow-Methods "GET,PUT,POST,DELETE"
Header set Access-Control-Allow-Headers "Content-Type, Authorization"

Answer 1

put this code in your .htaccess file and try it

<IfModule mod_headers.c>
   Header set Access-Control-Allow-Origin "*"
</IfModule>
<FilesMatch ".(eot|ttf|otf|woff)">
   Header set Access-Control-Allow-Origin "*"
</FilesMatch>