Multilingual menus with ananke theme

Using Themes
,
1

Hej there,

I’m building a website using the ananke theme and hugo v0.164.0 on Ubuntu Linux, where I ran into issues setting up a multilingual main menu. I started with a configuration according to the official Ananke guide , populating config/_default/menus.toml like this:

# config/_default/menus.toml
[[en.main]]
name = "About"
pageRef = "/about/"
weight = 10

[[de.main]]
name = "Über uns"
pageRef = "/about/"
weight = 10

But this led to hugo producing the following error:

ERROR failed to create config from result: failed to decode "menus":
unable to cast hmaps.Params{"main": []interface {}{map[string]interface 
{}{"name":"About", "pageRef":"/about/", "weight":10}}} of type
hmaps.Params to  []interface {}

After trying different things I found that Ananke expects in the config folder the same file structure as in the content folder - one file per language. So I split the menu into one file for english (default) and german:

---- menus.toml ----
[[main]]
name = "About"
pageRef = "/about/"
weight = 10


---- menus.de.toml ----
[[main]]
name = "Über"
pageRef = "/about/"
weight = 10

Seems the official documentation is a bit outdated? However, this topic is meant for documentation because I found nothing on the web regarding the error I stumbled into. Have fun with hugo!

2

Pretty sure Ananke (or any theme) does NOT expect any specific config file separation. This might be a Hugo requirement depending on your file structure. Without a full code sample with actual file structure of your content files I can’t say much about that.

3

just guessing, but the language specific menus are defined below a language. So the split to a toplevel menus.toml might only be possible for single language sites.

looking at the examples at Create language specific menu entries

it seems for Multilingual mode you coud either use

  • the main config file with
    [languages.de.menus]
      [[languages.de.menus.main]]
      [[languages.en.menus.main]]
  • configuration file - one per language
    the example uses the language code for all incl. the default. you might want to follow that, makes it easier to switch the default without renaming the files.

So the menus are defined below languages so when you extract these to a config file it might work if you create one language language.html and use [de.menus] and [en.menus] inside.

4

Thank you for your kind answer. I understood that Ananke is a multi-language theme but maybe I still misunderstand something there. (I’m new to hugo & its templates but find it a very powerful tool.)

In fact your suggestion about the main language config file works fine. I moved the main menu in there and it gets rendered fine. Here’s a stripped down code excerpt from my site:

# config/_default/languages.toml

[en]
languageName = "English"
languageCode = "en-gb"
weight = 1
title = "Example website"

[de]
languageName = "Deutsch"
languageCode = "de-de"
weight = 2
title = "Beispiel Webseite"

[en.menus]
  [[en.menus.main]]
    name = "About"
    pageRef = "/about/"
    weight = 10

[de.menus]
  [[de.menus.main]]
    name = "Über"
    pageRef = "/about/"
    weight = 10

So it’s about putting it in the right place. Hope that this is helpful for others.

5

Omit the trailing slash for pageref.