Page (as multilanguage site) still points to root and not /de/

Hi there, I have tried to set up a multi language site with the theme Hello Friend theme. As I have one issue I was not able to solve, I followed a bare bones setup as described here and here but cannot get my theme to properly work with ML.

The content structure of the theme is this

content/post/blog-post1
content/post/blog-post2
content/page1
content/page2

The index of the site with Hello Friend has a list of blog posts, and 2 nav items page1 and page2. I set up the ML site using this approach: defaultContentLanguageInSubdir = true whereby DefaultContentLanguage = "de"

Therefore, I created a folder en and de in content, like so:

content/de/post/blog-post1
content/de/post/blog-post2
content/de/page1
content/de/page2

and the same for en.

The issue: the main index shows the correct posts for both de and en, the links to each single de or en blog post works as well, but the nav items, e.g. page1 still point to the initial root content/page1 and not to content/de/page nor content/en/page1: href="../../../page1"

here is the config.toml - SCROLL DOWN to see all within the code window!

baseurl = "http://blog.domain.com"
languageCode = "de"
theme = "hello-friend"
paginate = 5

DefaultContentLanguage = "de"
defaultContentLanguageInSubdir = true
canonifyURLs = "true"
relativeURLs = "true"

[params]
  subtitle = "subtitle"
  description = "en"
  defaultTheme = "dark" # "light" or "dark"

[params.logo]
  logoText = "logo"

[menu]
  [[menu.main]]
    identifier = "page1"
    name = "page1"
    url = "/page1"
  [[menu.main]]
    identifier = "page2"
    name = "page2"
    url = "/page2"

[languages]
  [languages.de]
    contentDir = "content/de"
    title = "title de"
    languageName = "de"
    writtenBy = "Autor:"
    readMore = "Jetzt Weiterlesen"
    readOtherPosts = "Weitere Artikel lesen"
    weight = 1
  [languages.en]
    contentDir = "content/en"
    title = "title en"
    languageName = "en"
    writtenBy = "Written by"
    readMore = "Read More"
    readOtherPosts = "Read other posts"
    weight = 2

I have not looked into the structure of the templates much as I am new to Hugo. Any tip appreciated. Thanks you.

Update: even setting the aliases both to /de/page1/ in the de and en version makes the site open the en version.

+++

A fix could be to use aliases like this:

# content/en/page1.md
---
aliases:
    /page1/
    /en/page1/ # English version
---

and

# content/de/page1.md
---
aliases:
    /page1/
    /de/page1/ # German version
---

Although then it does point to an existing page, it does not honour DefaultContentLanguage = "de", ie. it always goes to the en version of that page. Not sure whether that is expected or a bug in Hugo.

Adding translationKey: page1 to page1.md does not work either (to link the translated page to another, as per Hugo Docs).

FYI: Running a local server for testing.

AI don’t see the any settings per languages.

Where do you define the contentDir setting for de and en?

AI don’t see the any settings per languages.
Where do you define the contentDir setting for de and en ?

that’s a usability issue of the forum, the full config.toml is posted above. you have to scroll the code section to see the remaining lines.

Oh yeah sorry about that.

I think it’s going to take a repo for us to look at. Can you share one?

Ok. So the problem lays in your menus.
Currently you set the menu from the config.toml with a hard coded url (/hire).
Hugo treats it as an definite URL and don’t associate it with any pages nor its translation. So it stays the same across any language.

Because Hire is a page from your content dir, you can set the menu from the front matter:

menu: main

I did this for the english and german hire pages, and I have a satisfying behaviour of the navigation.

If you insist on having all your menu in config.toml (including content pages), you should keep the current menu object as is (german being your default language, it will be treated as the german menu), and add a second one below the german configuration:
(I’m really bad at toml, here’s the yaml idea version)

languages:
  de:
    menus:
        main: 
           - identifier: hire
             name: Hire Us > ...
             url: en/hire

Thanks tons, Regis! That makes sense.

It’s not about having it in config.toml, but the author choose to do so (perhaps without ML in mind). Will test it out and close the thread if that works.

This is the final part, in config.yml for the multi-language site:

baseUrl: http://blog.domain.com
...
DefaultContentLanguage: en
defaultContentLanguageInSubdir: true
...

languages:
  en:
    languageName: en
    weight: 1
    contentDir: content/en
    writtenBy: Written by
    readMore: Read more
    readOtherPosts: Read other posts
    menus:
      main:
        - identifier: page-in-english
          name: page-in-english name
          url: /page-in-english
  de:
    languageName: de
    weight: 1
    contentDir: content/de
    writtenBy: German copy
    readMore: German copy
    readOtherPosts: German copy
    menus:
      main:
        - identifier: page-in-german
          name: page-in-german name
          url: /page-in-german

translationKey: page-in-english is set in page-in-english.md and page-in-german.md

I did experience though something strange and unexpected. Locally everything works, but after pushing to Gitlab, the German pages redirect to /post/de/post/page1/, locally it does not.

Perhaps of this?

canonifyURLs: false
relativeURLs: true

FYI

# .gitlab-ci.yml
image: monachus/hugo

variables:
  GIT_SUBMODULE_STRATEGY: recursive

pages:
  script:
  - hugo
  artifacts:
    paths:
    - public
  only:
  - master

Bottom line:
a. the config.yml needs to have the above code for the theme Hello Friend to work
b. in order have a working site on Gitlab, there two options:

  1. username.gitlab.io/repo-name -> config.yml needs to have canonifyURLs: true and relativeURLs: true
  2. (This is a guess, have not tested it yet) Set repo name to username.gitlab.io (the GL Pages URL will be the very same then, without the trailing /repo-name, add a new group if you already a site that has that repo name), relativeURLs can be set to relativeURLs: false then.

The issue is that the typical GL Pages Url is username.gitlab.io/repo-name. However, Hugo does cut of the TLD if the baseURL is set to http://domain.com/blog/, ie. the relative URL will contain /blog/…. And that may not work with ML or some theme structures.

Thanks @regis.

This is not explained in the Hugo Docs and should be added IMHO.

Update: b2 does not work with theme Hello Friend. My guess at the moment is that it’s because the theme does not honour relativeURLs: false, e.g. the generated markup is the same for false and true

Update 2: b2 does work. Though I still have to investigate the relativeURLs: false.