Shopify. 如何在大菜单中添加项目

在本教程中，您将学习如何在MegaMenu中添加一个新的菜单项 Shopify模板.

Shopify. 如何在大菜单中添加项目

1. 登录到您的管理面板并导航到主题部分.

2. Click on the 自定义主题 button.

3. 打开Megamenu选项，查看默认的6个项目.

4. 在本例中，我们将使用自定义链接添加新的菜单项，就像 About Us and/orContact Us menu items.

5. 回到主题页面并选择 Edit HTML/CSS option.

6. Under Snippets 分段、定位、打开 widget-megamenu.liquid file. Under Config section, open settings_data.json and settings_schema.json files.

7. In the widget-megamenu.liquid 文件找到要复制的菜单项, 在我们的例子中，我们将使用第6项.

8. 复制第6项的代码，粘贴在下面.

9. 将所有6号改为7号:

   
   {{ settings.megamenu6_text }}{% if settings.megamenu6_badge and settings.megamenu6_badge != '' %}{{ settings.megamenu6_badge }}{% endif %}
   
   
   {{ settings.megamenu7_text }}{% if settings.megamenu7_badge and settings.megamenu7_badge != '' %}{{ settings.megamenu7_badge }}{% endif %}
   
   

   

10. 现在我们需要复制并添加移动视图的新菜单项.

11. 找到以下代码: Megamenu_mobile visible-xs visible-sm.

12. 找到并复制第6项. 将6号改为7号，就像我们之前做的那样:

    
    {{ settings.megamenu7_text }}
    
    

    

13. 保存此文件.

14. 打开settings_data.json 并添加以下代码:

    “megamenu7_text”:“测试”,
    :“megamenu7_link \ \ /页面/og体育”,
    “megamenu7_badge”:“”,
    

    

15. Lastly, open settings_schema.json 文件并添加以下代码:

    “类型”:“头”,
    "content": "Item 7(新的自定义链接)"
    },
    {
    “类型”:“文本”,
    “id”:“megamenu7_text”,
    "label": "物品名称"
    },
    {
    “类型”:“文本”,
    “id”:“megamenu7_link”,
    "label": "项目URL"
    },
    {
    “类型”:“文本”,
    “id”:“megamenu7_badge”,
    "label": "项目标识(可选)"
    }
    

    注意:由于第6项不再是列表中的最后一项, 我们需要在新代码之前加一个逗号:

    

16. 保存此文件并转到 自定义主题 选项查看您的新添加的项目:

    

感谢您阅读本教程. 现在您知道了如何向MegaMenu添加一个新的菜单项.

请随时查看下面的详细视频教程:

Shopify. 如何在大菜单中添加项目