diff --git a/packages/docusaurus-theme-classic/src/theme/SiteMetadata/index.tsx b/packages/docusaurus-theme-classic/src/theme/SiteMetadata/index.tsx
index 4a275e819c17b..703ac58982bea 100644
--- a/packages/docusaurus-theme-classic/src/theme/SiteMetadata/index.tsx
+++ b/packages/docusaurus-theme-classic/src/theme/SiteMetadata/index.tsx
@@ -25,10 +25,19 @@ import SearchMetadata from '@theme/SearchMetadata';
// See https://github.com/facebook/docusaurus/issues/3317
function AlternateLangHeaders(): JSX.Element {
const {
- i18n: {defaultLocale, localeConfigs},
+ i18n: {currentLocale, defaultLocale, localeConfigs},
} = useDocusaurusContext();
const alternatePageUtils = useAlternatePageUtils();
+ const currentHtmlLang = localeConfigs[currentLocale]!.htmlLang;
+
+ // HTML lang is a BCP 47 tag, but the Open Graph protocol requires
+ // using underscores instead of dashes.
+ // See https://ogp.me/#optional
+ // See https://en.wikipedia.org/wiki/IETF_language_tag)
+ const bcp47ToOpenGraphLocale = (code: string): string =>
+ code.replace('-', '_');
+
// Note: it is fine to use both "x-default" and "en" to target the same url
// See https://www.searchviu.com/en/multiple-hreflang-tags-one-url/
return (
@@ -52,6 +61,20 @@ function AlternateLangHeaders(): JSX.Element {
})}
hrefLang="x-default"
/>
+
+
+ {Object.values(localeConfigs)
+ .filter((config) => currentHtmlLang !== config.htmlLang)
+ .map((config) => (
+
+ ))}
);
}