How to make sure hreflangs contain domain? | Nuxt | Page 1

elder wedge Sep 10, 2024, 2:44 PM

#

Google Lighthosue complains about SEO on my Nuxt3 page. The reason being is, they are not absolute URLs. This are the links generated in source:

<link rel="alternate" href="/en" hreflang="en" data-hid="7fcee50">
<link rel="alternate" href="/de-DE" hreflang="de" data-hid="5d718b2">
<link rel="alternate" href="/de-DE" hreflang="de-DE" data-hid="26cc44a">
<link rel="alternate" href="/en-DE" hreflang="en-DE" data-hid="64015ce">
<link rel="alternate" href="/en" hreflang="x-default" data-hid="6527e7a">

and this is my nuxt.config i18n part:

i18n: {
    defaultLocale: 'en',
    detectBrowserLanguage: false,
    langDir: 'i18n/',
    locales: [
      {
        code: 'en',
        iso: 'en',
        file: 'en.json',
        domain: 'https://www.example.com',
      },
      {
        code: 'de-DE',
        iso: 'de-DE',
        file: 'de.json',
        domain: 'https://www.example.com',
      },
      {
        code: 'en-DE',
        iso: 'en-DE',
        file: 'en.json',
        domain: 'https://www.example.com',
      },
    ],
    strategy: 'prefix',
    vueI18n: './nuxt-i18n.js',
    seo: true,
}

#

is there an obvious config missing that makes hreflang relative instead of absolute?

tender oasis Sep 10, 2024, 3:59 PM

#

You need to set the differentDomains flag if you want to utilize locale domains

elder wedge Sep 11, 2024, 2:25 PM

#

Thanks for reply! I have a single domain, locales are just subpath.

#

I got it to work in useHead() and manually adding domain to href

#

head.value = {
    ...head.value,
    link: head.value.link.map((link) => ({
      ...link,
      ...(link.href.startsWith('/') && {
        href: `https://www.example.com${link.href}`,
      }),
    })),
  }

#

hacky, but works and SEO checks pass

tender oasis Sep 11, 2024, 2:26 PM

#

What purpose does the domain key have in your locale config then?

elder wedge Sep 11, 2024, 2:26 PM

#

I was just trying to get hreflang to work, this was one of the suggestions from... mr GPT 😉

#

it is gone now from config

tender oasis Sep 11, 2024, 2:28 PM

#

Right. Wouldn’t it be easier to configure the baseUrl in i18n than using useHead?

#

As per the docs.

You must also set the baseUrl option to your production domain in order to make alternate URLs fully-qualified

elder wedge Sep 11, 2024, 2:31 PM

#

🤦

#

this was the config bit that was missing from nuxt.config

#How to make sure hreflangs contain domain?