Language Dropdown menu options

Hello All,
I have add to my hugo page a language selector(drop down menu) for the below two languages.You may find the additional code from the config.toml file.

[languages]
[languages.en]
title = ‘My blog’
weight = 1
languageName = ‘English’
contentDir= ‘content/english’

[languages.fr]
title = ‘France’
weight = 2
languageName = ‘Français’
contentDir= ‘content/french’

The language selector displayed successfully for both languages. My default language is English. When i click on a menu option, then in the language selector the another language is hidden. Seems that the language selector displays both languages options only when the user is navigated to the index page.

Any advise/suggestion?

My advice would be to post the actual code that is creating the dropdown. There are plenty of reasons why this could happen. One is that the dropdown is set to show only the languages that have a translation available for the current page itself.

Hello, thanks for your reply!

You may find the code from layouts\partials\language-selector.html file

{{- if and .Site.IsMultiLingual (not .Site.Params.DisableLanguageSwitchingButton)}}

{{ $siteLanguages := .Site.Languages}}
{{ $pageLang := .Page.Lang}}
{{ range .Page.AllTranslations }}
{{ $translation := .}}
{{ range $siteLanguages }}
{{ if eq $translation.Lang .Lang }}
{{ if eq $pageLang .Lang}}
{{ .LanguageName }}
{{ else }}
{{ .LanguageName }}
{{ end }}
{{ end }}
{{ end }}
{{ end }}

{{- end }}

Let me know if you need the code from any other file.

{{ range .Page.AllTranslations }}

Yep, this part says “range all translations of this current page”. If there is none no language is shown.

From another post directly answered by bep:

I’m writing this quick and untested:

  • .AllTranslations will give you a an ordered list of all translations of a Page, including the current one.
  • .Site.Home.AllTranslations will give you all “home pages”

Sidennote: this part here is useless because it does the same in either case. Just leave line 2 or 4 and remove the rest.

{{ if eq $pageLang .Lang}}
{{ .LanguageName }}
{{ else }}
{{ .LanguageName }}
{{ end }}

Thank you for your reply, now it works.

But how can i move the dropdown menu to the right side on the header?Which file should be edit?

Hi Everyone,

I am getting the following hreflang error on our site which is available in en-GB, de-DE, de-AT and de-CH:

Invalid
Not matching self-hreflang

After a bit of digging around, I figured that it is coming from the language selector tool which is coded so:

    {{ if .IsTranslated }}
    
      <select class="btn-white" id="select-language-desktop" onchange="location = this.value;">
        {{ $siteLanguages := site.Languages}}
        {{ $pageLang := .Page.Lang}}
        {{ range .Page.AllTranslations }}
        {{ $translation := .}}
        {{ range $siteLanguages }}
        {{ if eq $translation.Lang .Lang }}
        {{ $selected := false }}
        {{ if eq $pageLang .Lang}}
        <option id="{{ $translation.Language }}" value="{{ $translation.RelPermalink }}" selected>{{ .LanguageName }}
        </option>
        {{ else }}
        <option id="{{ $translation.Language }}" value="{{ $translation.RelPermalink }}">{{ .LanguageName }}</option>
        {{ end }}
        {{ end }}
        {{ end }}
        {{ end }}
      </select>

I didn’t code this, but from the looks of it, it doesn’t include any hreflang elements in the selector tool which is why the EN version always returns the language as en for all languages.

Any ideas on how to improve this?