Docusaurus does not generate og:locale and og:locale:alternate meta tags #8887

JavorszkyGaborOrianaWorld · 2023-04-13T05:02:32Z

Have you read the Contributing Guidelines on issues?

I have read the Contributing Guidelines on issues.

Prerequisites

I'm using the latest version of Docusaurus.
I have tried the npm run clear or yarn clear command.
I have tried rm -rf node_modules yarn.lock package-lock.json and re-installing packages.
I have tried creating a repro with https://new.docusaurus.io.
I have read the console error message carefully (if applicable).

Description

The built site does not have og:locale and og:locale:alternate meta tags in the Head.

Reproducible demo

https://codesandbox.io/p/sandbox/zen-wildflower-kpuv6l?file=%2FREADME.md

Steps to reproduce

Add at least two locales to docusaurus.config.js.
e.g.

i18n: {
    defaultLocale: "en",
    locales: ["en", "hu"],
    localeConfigs: {
      en: {
        label: "English",
        direction: "ltr",
        htmlLang: "en-US",
        calendar: "gregory",
      },
      hu: {
        label: "Magyar",
        direction: "ltr",
        htmlLang: "hu-HU",
        calendar: "gregory",
        path: "hu",
      },
    },
  },

Build
Serve

Expected behavior

In the built site pages in the Head tag og:locale and og:locale:alternate meta tags are present.

 <meta property="og:locale" content="en_US" />
 <meta property="og:locale:alternate" content="hu_HU" />

Actual behavior

In the built site pages in the Head tag og:locale and og:locale:alternate meta tags are not present.

Your environment

Public source code: no public code
Public site URL: no public site
Docusaurus version used: 2.4.0
Environment name and version (e.g. Chrome 89, Node.js 16.4):
- Microsoft Edge Version 112.0.1722.39 (Official build) (64-bit)
- node --version: v18.13.0
Operating system and version (e.g. Ubuntu 20.04.2 LTS):
- Edition Windows 11 Enterprise
- Version 22H2
- OS build 22621.1413

Self-service

I'd be willing to fix this bug myself.

The text was updated successfully, but these errors were encountered:

slorber · 2023-04-13T12:31:42Z

Hi @JavorszkyGaborOrianaWorld

Can you explain to me when/how this metadata is used?

We already output hreflang metadata.

See for example on https://docusaurus.io/docs/installation

<html lang="en">
  <head>
    <link
      data-rh="true"
      rel="canonical"
      href="https://docusaurus.io/docs/installation"
    />
    <link
      data-rh="true"
      rel="alternate"
      href="https://docusaurus.io/docs/installation"
      hreflang="en"
    />
    <link
      data-rh="true"
      rel="alternate"
      href="https://docusaurus.io/fr/docs/installation"
      hreflang="fr"
    />
    <link
      data-rh="true"
      rel="alternate"
      href="https://docusaurus.io/pt-BR/docs/installation"
      hreflang="pt-BR"
    />
    <link
      data-rh="true"
      rel="alternate"
      href="https://docusaurus.io/ko/docs/installation"
      hreflang="ko"
    />
    <link
      data-rh="true"
      rel="alternate"
      href="https://docusaurus.io/zh-CN/docs/installation"
      hreflang="zh-CN"
    />
    <link
      data-rh="true"
      rel="alternate"
      href="https://docusaurus.io/docs/installation"
      hreflang="x-default"
    />
  </head>
</html>

So this looks a bit like duplicate data to me (and less complete, no URL).

Which system reads og:locale but does not read hreflang and html lang?

slorber · 2023-04-13T12:38:16Z

@jdevalk any idea?

Should we use og:locale:alternate when we already have hreflang meta?

The only online refs I could find look in favor of using hreflang over og:locale:alternate

As far as I know, there's no "x-default" option for the OG locale:alternate attribute. Google will use the rel=alternate tag over OG anyway, so make sure you have that.

https://support.google.com/webmasters/thread/3570977/using-x-default-for-locale-opengraph-og-locale-alternate?hl=en

https://stackoverflow.com/questions/31861414/canonical-url-and-ogurl-for-multilanguage-site

This Open Graph tag allows you to set the location and language territory. You could say that og:locale is similar to the hreflang attribute in SEO in its intended use—targeting an audience.

https://seoasoorm.com/og-tag-seo/

jdevalk · 2023-04-14T07:02:04Z

hey @slorber! I think we should definitely output og:locale, and if we can easily and reliably output og:locale:alternate we should. It's mentioned in Facebook's sharing guidelines.

Unfortunately, there's not one unified standard that both Facebook and Google adhere to in these things.

slorber · 2023-04-14T08:45:18Z

Thanks @jdevalk , let's do this then!

A bit sad that we have to output duplicate info to each html page. With lots of locale that still takes a few useless bytes.

Shouldn't be very hard, good issue for someone willing to contribute!

Add this next to where we handle hreflang in theme, in AlternateLangHeaders component

(please don't ask to claim the issue, the first draft PR author gets the issue)

slorber · 2023-04-19T15:58:05Z

Just realizing that OGP is annoying by not respecting the BCP47 spec (pt-BR is BCP47, but ogp expects pt_BR)

See https://ogp.me/

og:locale - The locale these tags are marked up in. Of the format language_TERRITORY. Default is en_US.
og:locale:alternate - An array of other locales this page is available in.

<meta property="og:locale" content="en_GB" />
<meta property="og:locale:alternate" content="fr_FR" />
<meta property="og:locale:alternate" content="es_ES" />

Their doc is not very exhaustive but I guess we can just to this and call it a day:

function toOgLocale(locale) {
  return locale.replace("-","_");
}

FlorinaPacurar · 2023-07-13T09:32:02Z

I would like to work on this if possible

Xebec19 · 2023-08-01T03:24:14Z

I'd like to work on this

JavorszkyGaborOrianaWorld added bug An error in the Docusaurus core causing instability or issues with its execution status: needs triage This issue has not been triaged by maintainers labels Apr 13, 2023

slorber added status: needs more information There is not enough information to take action on the issue. and removed status: needs triage This issue has not been triaged by maintainers labels Apr 13, 2023

This was referenced Apr 14, 2023

Added og:locale and og:locale:alternate on staic site generation #8893

Closed

feat(core): add og:locale and og:locale:alternative meta tags #8894

Closed

slorber removed the status: needs more information There is not enough information to take action on the issue. label Apr 19, 2023

morsko1 mentioned this issue Jul 14, 2023

feat(theme-classic): add og:locale and og:locale:alternate meta tags #9147

Closed

3 tasks

FlorinaPacurar mentioned this issue Jul 17, 2023

feat(theme): add support for meta og locale and alternates #9152

Merged

3 tasks

Josh-Cena closed this as completed Aug 1, 2023

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Docusaurus does not generate og:locale and og:locale:alternate meta tags #8887

Docusaurus does not generate og:locale and og:locale:alternate meta tags #8887

JavorszkyGaborOrianaWorld commented Apr 13, 2023 •

edited

slorber commented Apr 13, 2023

slorber commented Apr 13, 2023 •

edited

jdevalk commented Apr 14, 2023

slorber commented Apr 14, 2023 •

edited

slorber commented Apr 19, 2023 •

edited

FlorinaPacurar commented Jul 13, 2023

Xebec19 commented Aug 1, 2023

Docusaurus does not generate og:locale and og:locale:alternate meta tags #8887

Docusaurus does not generate og:locale and og:locale:alternate meta tags #8887

Comments

JavorszkyGaborOrianaWorld commented Apr 13, 2023 • edited

Have you read the Contributing Guidelines on issues?

Prerequisites

Description

Reproducible demo

Steps to reproduce

Expected behavior

Actual behavior

Your environment

Self-service

slorber commented Apr 13, 2023

slorber commented Apr 13, 2023 • edited

jdevalk commented Apr 14, 2023

slorber commented Apr 14, 2023 • edited

slorber commented Apr 19, 2023 • edited

FlorinaPacurar commented Jul 13, 2023

Xebec19 commented Aug 1, 2023

JavorszkyGaborOrianaWorld commented Apr 13, 2023 •

edited

slorber commented Apr 13, 2023 •

edited

slorber commented Apr 14, 2023 •

edited

slorber commented Apr 19, 2023 •

edited