SEOLZ

Html lang

Quick win

Found on 12% of audited stores.

Add a correct `lang` attribute to your site's `<html>` tag so browsers, search engines, and assistive technologies know what language your store is written in.

What it is

Every web page starts with an `<html>` tag. Adding a `lang` attribute to that tag — for example, `<html lang="en">` for English — tells browsers, screen readers, and search engines what human language the page is written in. It is a single line of code that lives at the very top of every page on your site. Without it, software has to guess your language, and it often guesses wrong.

Why it matters

Search engines like Google use the `lang` attribute to serve your pages to users searching in the right language and country, which directly affects how much relevant organic traffic you receive. Screen readers used by visually impaired shoppers rely on it to pronounce words correctly — missing or wrong language declarations are one of the most common WCAG accessibility failures, and in many jurisdictions selling online without meeting basic accessibility standards carries legal risk. Browser features like built-in translation also depend on this attribute, so without it, customers browsing in a different language may get broken or missing translation prompts, reducing conversions. It is one of the easiest fixes on your entire site and leaves no good reason to skip it.

How to fix it

  1. Identify the correct BCP 47 language tag for your store's primary language (e.g., 'en' for English, 'en-US' for US English, 'fr' for French, 'de' for German). A full list is maintained by the IANA Language Subtag Registry.
  2. Locate the outermost <html> opening tag in your site's base template or theme file — this is the file that wraps every page.
  3. Add or update the lang attribute so it reads exactly: <html lang="xx"> where 'xx' is your chosen BCP 47 tag (e.g., <html lang="en-US">).
  4. If your store serves multiple languages on separate URLs or subdomains, ensure each language version's <html> tag carries its own correct lang value (e.g., the French version has <html lang="fr">).
  5. Save and publish the change, then view the page source (right-click › View Page Source) and confirm the opening <html> tag contains the correct lang attribute.
  6. Optionally, re-run an accessibility or SEO audit tool to verify the issue is resolved across all page templates (home, product, collection, blog, checkout).
<html lang="en-US">

Fix it on your platform

Pick your platform for the exact steps.

How to fix html lang on Shopify
  1. In your Shopify admin, go to Online Store › Themes.
  2. Next to your active theme, click Actions › Edit code.
  3. In the left-hand file list, open the Layout folder and click theme.liquid (this is the master template that wraps every page).
  4. Find the opening <html tag near the top of the file. It may already have attributes like class or dir.
  5. Add lang="en" (or your correct BCP 47 tag) inside it, e.g.: <html lang="en" class="no-js">
  6. Click Save. View your storefront, right-click › View Page Source, and confirm the <html> tag now shows the lang attribute.
Full Shopify guide →Official Shopify docs ↗
How to fix html lang on Shopify Plus
  1. Follow the same steps as Shopify above — edit theme.liquid in the active theme's Layout folder via Online Store › Themes › Actions › Edit code.
  2. If you use a custom checkout (Shopify Plus checkout.liquid), open checkout.liquid from the same Layout folder and add the lang attribute there too.
  3. Save and verify via View Page Source on both a storefront page and the checkout page.
Full Shopify Plus guide →Official Shopify Plus docs ↗
How to fix html lang on WooCommerce
  1. In your WordPress admin, go to Appearance › Theme File Editor (or use an FTP/file manager).
  2. Select your active theme in the top-right dropdown, then open header.php (or the equivalent root template — some block themes use html.php or parts/header.html).
  3. Locate the <html opening tag. WordPress typically outputs it via the language_attributes() template tag, which automatically inserts the correct lang attribute based on your site's configured language.
  4. If language_attributes() is already present (e.g., <html <?php language_attributes(); ?>>), the lang value is controlled by Settings › General › Site Language in the WordPress admin — set that to your correct language there.
  5. If the tag is hard-coded without language_attributes(), replace it with: <html <?php language_attributes(); ?>>
  6. Save, then check View Page Source on the frontend to confirm lang= appears in the <html> tag.
Full WooCommerce guide →Official WooCommerce docs ↗
How to fix html lang on WordPress.org
  1. Go to Settings › General in your WordPress admin and set the Site Language dropdown to your store's primary language — this is the master control.
  2. WordPress's language_attributes() function in your theme's header.php will then automatically output the correct lang attribute.
  3. If your theme has hard-coded the <html> tag without language_attributes(), go to Appearance › Theme File Editor › header.php and replace the opening tag with: <html <?php language_attributes(); ?>>
  4. Save changes and verify via View Page Source.
Full WordPress.org guide →Official WordPress.org docs ↗
How to fix html lang on BigCommerce
  1. In your BigCommerce admin, go to Storefront › My Themes.
  2. Click Customize on your active theme, then choose Edit Theme Files (or use the Stencil CLI for local development).
  3. Open templates/layout/base.html — this is the master layout that wraps every page.
  4. Find the <html tag and add lang="en" (or your correct BCP 47 code), e.g.: <html lang="en">
  5. Save and apply the theme, then verify via View Page Source on your live store.
Full BigCommerce guide →Official BigCommerce docs ↗
How to fix html lang on Wix
  1. Wix automatically sets the lang attribute on the <html> tag based on the language you select for your site.
  2. To set or change it: In the Wix Editor, click the Settings icon (gear) in the left panel, then go to Multilingual, or go to your Dashboard › Settings › Language & Region.
  3. Set your primary site language to the correct language for your content. Wix will inject the corresponding lang attribute into the <html> tag automatically.
  4. If you use Wix Multilingual for multiple languages, each language version's page will receive its own correct lang value automatically.
  5. You cannot directly edit the <html> tag in Wix — the language setting in the dashboard is the only control point. Ensure it matches the actual language of your content.
Full Wix guide →Official Wix docs ↗
How to fix html lang on Wix Studio
  1. In Wix Studio, the lang attribute is controlled by the site's language settings, same as standard Wix.
  2. Go to your site's Dashboard › Settings › Language & Region and confirm your primary language is correctly set.
  3. For multilingual sites, use the Wix Multilingual panel to add languages; each version will automatically carry the correct lang attribute.
  4. You cannot hand-edit the <html> tag directly; rely on the language settings to output the correct value.
Full Wix Studio guide →Official Wix Studio docs ↗
How to fix html lang on Squarespace
  1. Squarespace sets the lang attribute automatically based on your site's region/language setting.
  2. Go to your Squarespace admin › Settings › Language & Region (or Settings › Regional for older versions) and set the Site Language to your primary language.
  3. Squarespace will output the correct lang attribute on the <html> tag without any code editing needed.
  4. If you use Squarespace's Multiple Language feature (Business plan and above), each language page will carry its own lang value.
  5. Verify by opening your live site, right-clicking › View Page Source, and confirming <html lang=...> shows the correct code.
Full Squarespace guide →Official Squarespace docs ↗
How to fix html lang on Webflow
  1. In the Webflow Designer, open your Project Settings (gear icon in the top-left or via the dashboard).
  2. Go to the Localization tab (if using Webflow Localization) or the General / SEO tab.
  3. For single-language sites: Webflow sets the lang attribute from your project's primary locale. Go to Project Settings › Localization and confirm or set the primary language.
  4. For multi-language sites using Webflow Localization: each locale has its own lang setting, managed in Project Settings › Localization › Locales.
  5. You can also set a custom lang attribute per page by selecting the <html> element in the Designer (click the body, then navigate up to HTML in the element panel) and adding a lang attribute in the Custom Attributes section.
  6. Publish your site and verify via View Page Source.
Full Webflow guide →Official Webflow docs ↗
How to fix html lang on Adobe Commerce (Magento)
  1. The <html> tag with lang is rendered by the root page template. Locate the file: app/design/frontend/<Vendor>/<Theme>/Magento_Theme/templates/root.phtml (for custom themes) or the equivalent in vendor/magento/module-theme/view/frontend/templates/root.phtml.
  2. Open root.phtml in your custom theme (never edit core files directly) and find the <html tag.
  3. Magento provides a helper to output locale/language info. Add the lang attribute using the store's locale: <html lang="<?= $block->escapeHtmlAttr(strstr($currentLocale, '_', true)) ?>"> — or hard-code the BCP 47 tag if you have a single-language store, e.g., <html lang="en">.
  4. For a cleaner approach, use the Locale Resolver: inject \Magento\Framework\Locale\ResolverInterface in a custom block and output the language code.
  5. After saving, run bin/magento cache:clean and bin/magento setup:static-content:deploy, then verify via View Page Source on the frontend.
Full Adobe Commerce (Magento) guide →Official Adobe Commerce (Magento) docs ↗
How to fix html lang on Magento Open Source
  1. Follow the same steps as Adobe Commerce above — edit root.phtml in your custom theme under app/design/frontend/<Vendor>/<Theme>/Magento_Theme/templates/.
  2. Add lang="en" (or the correct BCP 47 tag) to the <html> element.
  3. Run bin/magento cache:clean after saving, then verify via View Page Source.
Full Magento Open Source guide →Official Magento Open Source docs ↗
How to fix html lang on PrestaShop
  1. In your PrestaShop admin, the lang attribute is rendered by the theme's layout template.
  2. Navigate to your active theme folder at themes/<your-theme>/templates/layouts/ and open layout-full-width.tpl (or layout-both-columns.tpl etc., whichever is used as the base).
  3. Find the <html tag. PrestaShop's Smarty templates typically output the language using {$language.iso_code} or {$language.language_code}.
  4. Update the tag to: <html lang="{$language.iso_code}"> — this dynamically pulls the ISO code of the active language.
  5. Save and clear the PrestaShop cache via Advanced Parameters › Performance › Clear cache, then verify via View Page Source.
Full PrestaShop guide →Official PrestaShop docs ↗
How to fix html lang on OpenCart
  1. In OpenCart, the HTML wrapper is in the theme's header template file, typically catalog/view/theme/<your-theme>/template/common/header.twig (or header.tpl for older versions).
  2. Open that file via Admin › Design › Theme Editor, or via FTP.
  3. Find the <html opening tag and add the lang attribute. OpenCart passes language data to templates; use the language code variable, e.g.: <html lang="{{ language_code }}"> or hard-code your language: <html lang="en">.
  4. Save the file and clear the OpenCart cache via Admin › Dashboard › cog icon › Refresh, then verify via View Page Source.
Full OpenCart guide →Official OpenCart docs ↗
How to fix html lang on BigCommerce for WP
  1. The <html> tag is rendered by your WordPress theme's header.php, not the BigCommerce for WordPress plugin.
  2. Follow the WooCommerce / WordPress.org steps above to ensure language_attributes() is in your theme's header.php and that Settings › General › Site Language is set correctly.
Full BigCommerce for WP guide →Official BigCommerce for WP docs ↗

Does your site have this issue?

Run a free SEOLZ audit to find html lang — and every other issue — across your whole site in minutes.

Scan my site free

Frequently asked questions

What is Html lang?

Every web page starts with an `<html>` tag. Adding a `lang` attribute to that tag — for example, `<html lang="en">` for English — tells browsers, screen readers, and search engines what human language the page is written in. It is a single line of code that lives at the very top of every page on your site. Without it, software has to guess your language, and it often guesses wrong.

Why does html lang matter?

Search engines like Google use the `lang` attribute to serve your pages to users searching in the right language and country, which directly affects how much relevant organic traffic you receive. Screen readers used by visually impaired shoppers rely on it to pronounce words correctly — missing or wrong language declarations are one of the most common WCAG accessibility failures, and in many jurisdictions selling online without meeting basic accessibility standards carries legal risk. Browser features like built-in translation also depend on this attribute, so without it, customers browsing in a different language may get broken or missing translation prompts, reducing conversions. It is one of the easiest fixes on your entire site and leaves no good reason to skip it.

How do I fix html lang?

Add a correct `lang` attribute to your site's `<html>` tag so browsers, search engines, and assistive technologies know what language your store is written in.

Related Site Lifecycle issues