Hugo zen theme control menu order

Hi, I’m trying to use Hugo with Zen theme. I’m a beginner at both.

Zen theme has this nice feature that if you do not define a main menu

the template will automatically add entries for the home page, each root page and each section

However, it orders the entries in alphabetical order. What if I want some other order? Can I control the menu items’ order if using this automatic feature Zen theme provides?

No. Define the menu in your site configuration, using non-zero weights to control the order. The “lighter” entries float to the top, while the “heavier” entries sink to the bottom. Example:

config.toml

[[menu.main]]
name = 'Home'
pageRef = '/'
weight = '10'

[[menu.main]]
name = 'Books'
pageRef = '/books'
weight = '20'

[[menu.main]]
name = 'Films'
pageRef = '/films'
weight = '30'

Thank you, that works easily enough.

I just noticed that I inadvertently quoted the weights. We convert to integer if needed, but they should really be integers in the site config for clarity.

[[menu.main]]
name = 'Home'
pageRef = '/'
weight = 10

[[menu.main]]
name = 'Books'
pageRef = '/books'
weight = 20

[[menu.main]]
name = 'Films'
pageRef = '/films'
weight = 30

Got it, made the change. Thanks

1 Like

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