Include extra data with menu

I would love to be able to include additional data with menu entries. Currently, I am using an array in the site config to provide additional information and am using a menu to keep track of the active menu item. Ideally, I would want to use a menu to keep track of the active menu item while also providing additional meta information that I could optionally use.

In my case, the main page displays images and mousing over those images reveals the name of the menu item (and has a link to the proper page). On subsequent pages, the menu is a hover that only shows the name of each section (no additional data used).

Adding a Description field on menu item is a good idea and easy to do, I guess.

I was thinking of more complicated data. Would it be feasible to store an entire TOML table (same with JSON)? Ideally, I’d want something like this:

[[menu.main]]
    name = "about hugo"
    pre = "<i class='fa fa-heart'></i>"
    weight = -110
    identifier = "about"
    url = "/about/"

[[menu.main]]
    name = "getting started"
    pre = "<i class='fa fa-road'></i>"
    weight = -100
    url = "/getting-started/"

    [menu.main.data]
        field1 = "some info"
        ....

Yea, that would make it a map …

Is it already an array of maps (tables)? Or is the underlying implementation different than if you wrote the menu with some other label than [[menu.main]]?

Your response makes it seem like it being a map is a bad thing? Any reason why? Just seems like it would be handy to be able to attach arbitrary information (even if the field is specific like [menu.main.data]).

It was just a comment on the implementation.

Not a bad thing, but I’m not sure having complex data structures as part of the menu is a common use case.

Gotcha. It just seems to make sense in my head that a menu could support this capability, but I cannot say whether or not this would have a common use case. My only thought is that others might run into this issue if they find that the pre/post properties are not enough, which is the case for me. Mostly because I want to be able to custom tailor the menu on the homepage versus other pages without needing to duplicate the information between a menu and a normal array of maps/tables.

I have a custom menu where I have a special image for each menu item. I don’t want to leave it in the HTML because I want all my menus to be accessible in the config.toml. It’s a little weird having some menu items in the config.toml and others in the html…

Is there any way around this :

[[menu.logo]]
  name = "N3 UX"
  url = "http://dwprivdn00020.mvt.desjardins.dev:4850/"
  weight = "4"
  img  = "logo-n3ux.png"

I want to be able to access my img parameter here.

2 Likes