Question about hreflang attribute

support
1

Hey everyone, I am going through the same problem. By default, Hugo generates the following links with the translationKey being the same in both files:

<link rel="alternate" hreflang="en" href="https://tramitit.com/en/guides/romania/auto_taxes_and_fees/">
<link rel="alternate" hreflang="ro" href="https://tramitit.com/ro/guides/romania/taxe_si_impozite_auto/">
<link rel="alternate" hreflang="x-default" href="https://tramitit.com/ro/guides/romania/taxe_si_impozite_auto/">

However, I would like to configure the x-default to always be the English page. Where should I put the suggested approaches? In index.html?

2

Please clarify your question.

a) What’s the problem?
b) What template code is generating the link elements?
c) How is the site configured?
d) What does the front matter look like?
e) etc.

You are more likely to receive a prompt and accurate response if you post a link to your project’s Git repository.

See Requesting Help.

Let us see your code

Include a link to the source code repository of your project, because we really need the context of seeing your templates and partials to be able to help you. It is trivial to do a quick git clone on your repo, then run hugo server in your project, to help you out. On the other hand, recreating your code from screenshots, or sort of guessing at it, is not.

If you can’t share your repository for whatever reason, consider creating a dummy repo that you can share, which reproduces the problem you’re experiencing.

3

Hey @jmooring, thanks for the quick answer!
I responded in-line with the other thread, so we lost context there.

I left the issue open in our repo here: Fixing x-default in /guides · Issue #3 · tramitit/tramitit.github.io · GitHub

4

AHREFs identifies that the rel=alternate tags are not placed correctly

I don’t know what that means. Can you be specific about what you are seeing vs. what you want?

5

Let’s focus on the GitHub issue I posted:

  • through the partial created I can add rel=alternate’s as I wish:

Screenshot 2024-06-11 at 17.09.14

  • but I cannot remove the default ones - can you help me in these?

Screenshot 2024-06-11 at 17.09.28

6

Can you point me at the partial so that I don’t have to dig for it?

7

Sure. I implemented the following code in layouts/partials/head.html:

{{- if .IsTranslated -}}
    {{ range .AllTranslations }}
    {{- if eq .Language.Lang "en" -}}
    <link rel="alternate" hreflang="x-default" href="{{ .Permalink }}" />
    {{- end -}}
    <link rel="alternate" hreflang="{{ .Language.Lang }}" href="{{ .Permalink }}" />
    {{- end -}}
{{ end }}

I also adapted layouts/_default/headof.html with:

<head>
    <!-- Fix for when x-default is not English: https://dariusz.wieckiewicz.org/en/setting-hreflang-and-x-default-on-multilingual-site/ -->
    {{ partial "head.html" . }}
    
    <!-- head (don't cache it) -->
    {{ partial "essentials/head.html" . }}

    <!-- style (always cache it) -->
    {{ partialCached "essentials/style.html" . }}

  </head>

However, the default rel=alternate are still being generated, would love your help in getting rid of them and only sticking to the overwritten ones in layouts/partials/head.html.

8

Sorry, I’m confused. If you don’t want the first one, why are you doing this?

Or maybe you’re asking, “How do I exclude the current language?” If yes, range through .Translations instead of .AllTranslations.

9

@jmooring if you look at an example of my pages (one here), this code still generates 5 rel=alternate in the <head>:

Screenshot 2024-06-11 at 17.52.48
Screenshot 2024-06-11 at 17.52.481238Ă—778 163 KB

The three top ones are the default ones (the ones I want to get rid of), and the two bottom ones are the ones I configured in the partial.

10

Run hugo mod vendor and then search the code base for .AllTranslations.

You’ll find this file:
_vendor/github.com/gethugothemes/hugo-modules/seo-tools/basic-seo/layouts/partials/basic-seo.html

With this code:

<!-- multilingual SEO optimizations -->
{{ if .IsTranslated }}
  {{ range .AllTranslations }}
    <link rel="alternate" hreflang="{{ .Lang }}" href="{{ .Permalink }}" />
  {{ end }}
  <link rel="alternate" hreflang="x-default" href="{{ .Permalink }}" />
{{ end }}

Just override that partial (create layouts/partials/basic-seo.html), and remove the section above.

When you’re done, remove the _vendor directory.

2 Likes
11

@jmooring super, that was exactly it!

1 Like
12

This topic was automatically closed 2 days after the last reply. New replies are no longer allowed.