带有图标的巨型下拉菜单

Question

我有一个巨大的下拉菜单，每个菜单项都有大图标。 BOLT 菜单是否也提供 URL 选项，我可以在其中保存该图标的 url 并在循环中输出 Img URL 值？

main:
    - label: Home
      title: This is the first menu item.
      path: homepage
      class: first
     #imgurl: url <- SOMETHING LIKE THIS #

使用 class 是另一种选择，但我真的不想在这里使用 CSS 伪选择器来添加背景图像。还有其他可能吗？

Answer 1

只需将 imgurl 选项添加到配置中。在您的模板中，您可以像 item.imgurl.

一样访问它

当您查看默认菜单实现时，您会发现它遍历菜单项，并在其中调用呈现菜单项 + 任何子菜单的函数： https://github.com/bolt/bolt/blob/release/3.0/app/theme_defaults/_sub_menu.twig#L40-L42

正如您在下面的 link 中看到的，您只需访问菜单项上定义的选项。 https://github.com/bolt/bolt/blob/release/3.0/app/theme_defaults/_sub_menu.twig#L20-L22

Mega drop down menu with icons