I have domain zeleninakratochvil.cz and just bought subdomain kvetinykratochvil.cz. It supposed to look identically the same but it doesn’t. I don’t know why. Website is running on wordpress last version. Provider of hosting only told me that there is a error in console with CORS and from some reason it won’t load some css styles from main domain (zeleninakratochvil.cz).
Error from chrome console:
Access to font at 'https://www.zeleninakratochvil.cz/wp-content/plugins/social-icons-widget-by-wpzoom/assets/font/fontawesome-webfont.woff2?v=4.7.0' from origin 'https://kvetinykratochvil.cz' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.
It results to different appearance especially in caption "zeleninakratochvil" which looks like different font style and some social icons and look up button is not showed correctly. I tryed some plugins and laborate with API (I don’t know how it works) and no success. I also tryed look up some manuals how to load css to subdomain and still no success. So I hope here some experienced person could help me in this problem. I would very appreciate it. Thanks
>Solution :
The error message you are seeing in the console indicates that there is a problem with the CORS (Cross-Origin Resource Sharing) policy on your website. This policy is in place to prevent malicious scripts from accessing resources (such as fonts, images, or stylesheets) from a different domain than the one the website is hosted on.
In this case, it seems that the font resource located at ‘https://www.zeleninakratochvil.cz/wp-content/plugins/social-icons-widget-by-wpzoom/assets/font/fontawesome-webfont.woff2?v=4.7.0’ is being blocked by the CORS policy when it is being accessed from the subdomain ‘https://kvetinykratochvil.cz’.
To fix this issue, you can try adding the following code to the .htaccess file in the root directory of your website:
Header set Access-Control-Allow-Origin "*"
This code will allow access to all resources on your website from any domain. If you want to restrict access to only specific domains, you can replace the "*" with the domain(s) you want to allow access from.
Alternatively, you can try modifying the CORS policy settings in your hosting provider’s control panel or contact their customer support for further assistance.
Once the CORS issue is resolved, the font and other resources should be loaded correctly on your subdomain, and the appearance of your website should be consistent across both domains.