带有图标的超级下拉菜单 [英] Mega drop down menu with icons

问题描述

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

I am having a mega drop down menu with big icons against each menu item. Does the BOLT menu provides a URL option too where I could save the url of that icon and output that Img URL value in loop?

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

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

Using class is another option but i don't really want to use CSS pseudo selector here to add background image. Is there any other possibility?

推荐答案

只需将 imgurl 选项添加到配置。在模板中，您可以像 item.imgurl 这样访问它。

just add the imgurl option to the config. In your template you can access it like item.imgurl.

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

When you look at the default menu implementation, you see that it iterates over the menu items where it calls a function that renders the menu item + any sub menus: https://github.com/bolt/bolt/blob/release/3.0/app/theme_defaults/_sub_menu.twig#L40-L42

如下面的链接所示，您只需访问菜单项上定义的选项。
https：// github .com / bolt / bolt / blob / release / 3.0 / app / theme_defaults / _sub_menu.twig＃L20-L22

And as you can see in the following link, you just access the options defined on the menu entry. https://github.com/bolt/bolt/blob/release/3.0/app/theme_defaults/_sub_menu.twig#L20-L22

这篇关于带有图标的超级下拉菜单的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！