How to Fix Access-Control-Allow-Origin Errors for Multilingual WordPress Sites
Content
If you're running a multilingual WordPress site using subdomains (like de.yoursite.com and en.yoursite.com), you might encounter a frustrating issue where resources like fonts, stylesheets, or scripts fail to load on one of your language versions. The browser's console will often show an error related to the Access-Control-Allow-Origin header. This guide will explain why this happens and provide the correct solutions.
Why Does This Error Occur?
This is a security feature enforced by web browsers known as CORS (Cross-Origin Resource Sharing). By default, a web page from one domain (e.g., de.yoursite.com) is not permitted to access resources on another domain (e.g., yoursite.com). The server must explicitly grant permission by sending the correct Access-Control-Allow-Origin header.
A common mistake, as seen in the support threads, is to define the header multiple times in the .htaccess file. The following configuration is incorrect because the second header directive will overwrite the first, making it only effective for the English subdomain:
# ❌ INCORRECT: This will not work for both domains
<IfModule mod_headers.c>
Header set Access-Control-Allow-Origin "https://de.test.sacconicase.com"
</IfModule>
<IfModule mod_headers.c>
Header set Access-Control-Allow-Origin "https://en.test.sacconicase.com"
</IfModule>
Solution 1: Specify Multiple Origins in a Single Header (Advanced)
The official way to solve this is to configure your server to dynamically allow multiple origins. This typically requires access to your server's main configuration (e.g., Apache's httpd.conf or a virtual host file) and knowledge of the mod_setenvif module. It is complex and often requires a system administrator's help.
Solution 2: The Wildcard Method (Use with Caution)
A simpler, but less secure, alternative is to use a wildcard (*) to allow all domains. This is quick but should only be used on development/staging sites or if you are absolutely sure you will not be serving any private user data from the resources being shared.
# ⚠️ Use wildcard only if security is not a concern
<IfModule mod_headers.c>
Header set Access-Control-Allow-Origin "*"
</IfModule>
Solution 3: The Recommended WordPress Approach
For most users, the best and most secure solution is to avoid the cross-origin request altogether. Instead of having your subdomains pull resources from your main domain, you should serve all assets (CSS, JS, fonts) directly from each subdomain.
This often means ensuring your WordPress site is configured correctly to handle subdomains. Key steps include:
- Defining WP_SITEURL and WP_HOME: Use conditional code in your
wp-config.phpfile to dynamically set the site URL based on the subdomain, ensuring all generated links point to the correct origin.
// Example wp-config.php snippet for subdomains
define( 'WP_SITEURL', 'https://' . $_SERVER['HTTP_HOST'] );
define( 'WP_HOME', 'https://' . $_SERVER['HTTP_HOST'] );
if ('de.' == substr( $_SERVER['HTTP_HOST'], 0, 3 )) {
define ('WPLANG', 'de_DE');
}
if ('en.' == substr( $_SERVER['HTTP_HOST'], 0, 3 )) {
define ('WPLANG', 'en_EN');
}
- Using a CDN: Serve your static assets from a Content Delivery Network (CDN). The CDN's domain becomes the single origin for your files, eliminating the cross-origin issue between your own subdomains.
- Checking Plugin Settings: Some optimization or asset-handling plugins have settings to help with domain handling for CDNs or multilingual setups.
Conclusion
The Access-Control-Allow-Origin error is a common hurdle when setting up a custom multilingual WordPress installation. While tweaking .htaccess is a natural first thought, the most robust and secure solution is to architect your site so that each subdomain is self-contained or uses a neutral third party (a CDN) for shared resources. Always avoid the wildcard method on production sites handling sensitive data.
Related Support Threads Support
-
setting the subdomain for english languagehttps://wordpress.org/support/topic/setting-the-subdomain-for-english-language/
-
Multiple Parent Pagehttps://wordpress.org/support/topic/multiple-parent-page/
-
having many different versions of URL languageshttps://wordpress.org/support/topic/having-many-different-versions-of-url-languages/
-
Adding gettexthttps://wordpress.org/support/topic/adding-gettext/
-
site link is too longhttps://wordpress.org/support/topic/site-link-is-too-long/
-
switching from an inner page in italian into an inner page into i.e englishhttps://wordpress.org/support/topic/switching-from-an-inner-page-in-italian-into-an-inner-page-into-i-e-english/
-
Replace underscore with hyphen on one part of a urlhttps://wordpress.org/support/topic/replace-underscore-with-hyphen-on-one-part-of-a-url/
-
switch for german/ english linkshttps://wordpress.org/support/topic/switch-for-german-english-links/
-
Adding a javaScript as linkhttps://wordpress.org/support/topic/adding-a-javascript-as-link/
-
Differentiate page name frome page title ?https://wordpress.org/support/topic/differentiate-page-name-frome-page-title/
-
How to change page linkhttps://wordpress.org/support/topic/how-to-change-page-link/
-
Adding custom hreflang tags for each pagehttps://wordpress.org/support/topic/adding-custom-hreflang-tags-for-each-page/
-
language selector before page openhttps://wordpress.org/support/topic/language-selector-before-page-open/
-
How to translate embedded content buttonshttps://wordpress.org/support/topic/how-to-translate-embedded-content-buttons/
-
Sidebar does not display the same content in different languageshttps://wordpress.org/support/topic/sidebar-does-not-display-the-same-content-in-different-languages/
-
How add Localization in our wordpress sitehttps://wordpress.org/support/topic/how-add-localization-in-our-wordpress-site/
-
parsing_links JSON response objecthttps://wordpress.org/support/topic/parsing_links-json-response-object/
-
problem with mobile menu in german versionhttps://wordpress.org/support/topic/problem-with-mobile-menu-in-german-version/
-
How to provide link to other countries?https://wordpress.org/support/topic/how-to-provide-link-to-other-countries/
-
The official Japanese URL is not connected.https://wordpress.org/support/topic/the-official-japanese-url-is-not-connected/
-
ayudahttps://wordpress.org/support/topic/ayuda-22/
-
Custom Language Selectionhttps://wordpress.org/support/topic/custom-language-selection/
-
Convert website to applicationhttps://wordpress.org/support/topic/convert-website-to-application/