If this tutorial is not what you were looking for, you still have any questions, suggestions or concerns - feel free to let us know. Please help us to serve you better!

Your Name

Your Email

Your Message (required)

captcha

Shopify. How to add item to megamenu (based on 58030+ templates)

Usually the mega menu consists of 6 menu items. To add one more item, perform the following changes.

Shopify._How_to_add_item_to_megamenu_(based_on_58030+_templates)_1

  1. Open site admin panel and navigate to Online Store > Themes > Edit HTML/CSS.

    Shopify._How_to_add_item_to_megamenu_(based_on_58030+_templates)_2

  2. Open settings_schema.json file located inside the Config folder and save its copy.

    Add this code after the last megamenu item code, that will be around Line 1700, before the closing ] for the menu section. Since item 6 is no longer the last item in the list, we need to add a comma prior the new code.

    	  
    	  ,
          { 
    "type": "header", 
    "content": "Item 7" 
    }, 
    { 
    "type": "text", 
    "id": "mm7_name", 
    "label": "Item name", 
    "info": "Clear this field to disable Item #1" 
    }, 
    { 
    "type": "text", 
    "id": "mm7_link", 
    "label": "Item URL" 
    }, 
    { 
    "type": "text", 
    "id": "mm7_badge", 
    "label": "Item badge" 
    }, 
    { 
    "type": "paragraph", 
    "content": "———————————————————" 
    }, 
    { 
    "type": "checkbox", 
    "id": "mm7_sub_toggle", 
    "label": "Submenu" 
    }, 
    { 
    "type": "radio", 
    "id": "mm7_sub_content", 
    "options": [ 
    { 
    "value": "links_1", 
    "label": "1. Single menu (linklist)" 
    }, 
    { 
    "value": "links_4", 
    "label": "2. Block of menus (linklists)" 
    }, 
    { 
    "value": "products", 
    "label": "3. Products (collection)" 
    }, 
    { 
    "value": "blog", 
    "label": "4. Blog" 
    } 
    ] 
    }, 
    { 
    "type": "link_list", 
    "id": "mm7_sub_links_1", 
    "label": "1. Choose single menu (linklist)" 
    }, 
    { 
    "type": "link_list", 
    "id": "mm7_sub_links_4_1", 
    "label": "2. Choose Block of menus (linklists)" 
    }, 
    { 
    "type": "image", 
    "id": "img_list7_img_1.jpg", 
    "label": "Image file", 
    "max-width": 255, 
    "max-height": 167, 
    "info": "Maximum slide image dimensions are 255x167px" 
    }, 
    { 
    "type": "link_list", 
    "id": "mm7_sub_links_4_2" 
    }, 
    { 
    "type": "image", 
    "id": "img_list7_img_2.jpg", 
    "label": "Image file", 
    "max-width": 255, 
    "max-height": 167, 
    "info": "Maximum slide image dimensions are 255x167px" 
    }, 
    { 
    "type": "link_list", 
    "id": "mm7_sub_links_4_3" 
    }, 
    { 
    "type": "image", 
    "id": "img_list7_img_3.jpg", 
    "label": "Image file", 
    "max-width": 255, 
    "max-height": 167, 
    "info": "Maximum slide image dimensions are 255x167px" 
    }, 
    { 
    "type": "link_list", 
    "id": "mm7_sub_links_4_4" 
    }, 
    { 
    "type": "image", 
    "id": "img_list7_img_4.jpg", 
    "label": "Image file", 
    "max-width": 255, 
    "max-height": 167, 
    "info": "Maximum slide image dimensions are 255x167px" 
    }, 
    { 
    "type": "collection", 
    "id": "mm7_sub_products", 
    "label": "3. Choose products (collection)" 
    }, 
    { 
    "type": "blog", 
    "id": "mm7_sub_blog", 
    "label": "4. Choose blog" 
    }
    

    Shopify._How_to_add_item_to_megamenu_(based_on_58030+_templates)_3

  3. Save the changes.

  4. In the Snippets > widget-megamenu.liquid file change 6 to 7 in the following code around Line 10:

    {% for i in (1..6) %} 
  5. Save the changes.

    Shopify._How_to_add_item_to_megamenu_(based_on_58030+_templates)_5

  6. In the Locales > en.default.json file add the code for the new menu item around Line 26:

  7. Save the changes.

    Shopify._How_to_add_item_to_megamenu_(based_on_58030+_templates)_6

  8. Save the changes and refresh the site.

    Shopify._How_to_add_item_to_megamenu_(based_on_58030+_templates)_7

Take a look at the selection of top-notch Shopify themes.

Feel free to check the detailed video tutorial below:

Shopify. How to add item to megamenu (based on 58030+ templates)