In a recent Business Bloomer Club Slack thread, we discussed what happens when a user visits a WordPress website using a browser set to a different language than the one defined in the settings.
The conversation started from a simple question: if a site isn’t multilingual, can it still adapt to the visitor’s language settings in some way?
It’s an important topic for WooCommerce store owners who want to offer a more personalized shopping experience to international users without relying on multilingual plugins. In some cases, you might want to display content in another language, show different notices, or adjust field labels depending on the user’s browser language — without going full WPML or Polylang.
Let’s explore what WordPress and WooCommerce do by default, what you can expect, and how you can build conditional content for international visitors based on browser settings alone.
How WordPress Handles Browser Languages by Default
WordPress does not automatically translate or localize the site content based on the visitor’s browser language unless you’re using a multilingual plugin.
The site’s language — defined under Settings > General > Site Language — determines the interface language (e.g. date formats, admin labels, system messages), but not post content or custom strings.
If your store is set to English, users will see the English version of system messages and plugin labels — even if their browser is in Italian or Spanish. For full localization, you’d need to either:
- Set up a multilingual site using a plugin (WPML, Polylang, TranslatePress, etc.), or
- Customize your site to detect browser language and load different content or templates conditionally.
That said, WooCommerce core and many plugins do include translation files (.po/.mo) for multiple languages.
If the site language is changed to match a visitor’s browser (manually or dynamically), WordPress can switch to those translations — but only then.
Detecting Browser Language With JavaScript
While PHP has no reliable way to detect a user’s browser language, JavaScript does. The navigator.language or navigator.languages property can be used to capture the visitor’s primary browser language and act on it.
For example, here’s a basic snippet that shows a custom notice to Italian users:
document.addEventListener('DOMContentLoaded', function () {
const userLang = navigator.language || navigator.userLanguage;
if (userLang.startsWith('it')) {
const el = document.createElement('div');
el.innerHTML = '<p style="background:#f5f5f5;padding:10px;">Benvenuto! Puoi contattarci anche in italiano.</p>';
document.body.insertBefore(el, document.body.firstChild);
}
});You can enqueue this via wp_footer, a custom plugin, or directly in a theme file. This method does not require a multilingual setup and is excellent for light personalization.
Showing or Hiding HTML Based on Language
If you want to prepare different versions of a section in advance, you can use CSS classes combined with JavaScript detection:
<div class="language-message lang-it">Ciao! Questa è la versione italiana.</div>
<div class="language-message lang-en">Hello! This is the English version.</div>And now the JS:
document.addEventListener('DOMContentLoaded', function () {
const userLang = navigator.language || navigator.userLanguage;
document.querySelectorAll('.language-message').forEach(el => el.style.display = 'none');
if (userLang.startsWith('it')) {
document.querySelector('.lang-it')?.style.display = 'block';
} else {
document.querySelector('.lang-en')?.style.display = 'block';
}
});This allows for conditional visibility of content blocks without any backend changes. You can extend it to more languages with minimal effort.
WooCommerce Field Labels and User Language
One issue raised in the Slack thread was whether it’s possible to change WooCommerce checkout field labels based on user language if you don’t have a multilingual site.
As covered in another blog post, WooCommerce labels are rendered server-side in PHP, so changing them dynamically based on browser language is not feasible with PHP alone.
However, using JavaScript — just like we did with notices — you can replace labels on the fly:
document.addEventListener('DOMContentLoaded', function () {
const userLang = navigator.language || navigator.userLanguage;
if (userLang.startsWith('it')) {
const label = document.querySelector('label[for="billing_company"]');
if (label) label.innerText = 'Ragione sociale';
}
});It’s not perfect, as the translated strings won’t be automatically pulled from .po/.mo files, but it works well for small-scale cases where you want better UX for a single language audience.
Conclusion
If you’re not running a multilingual WooCommerce site, visitors will see your default language — regardless of their browser settings. That said, you can still provide a customized experience for international users using JavaScript. From notices to field labels, conditional HTML content, and UX tweaks, browser language detection offers a light and effective alternative.
For WooCommerce store owners who want to keep things simple, these small adjustments can go a long way in making foreign users feel acknowledged — without the overhead of a full translation setup.
