How to can you make 2 separate menus in the header?

Store Design

Topic summary

Goal: Create a dual-menu header layout in Shopify—one basic menu on top and a main collections menu below, positioned next to store icons.

Initial Solution (Dawn Theme):

  • User EBOOST provided code modifications for sections/header.liquid
  • Involved duplicating menu settings and adding custom navigation markup
  • Required creating a second menu in Shopify admin and referencing it via handle (e.g., linklists.legal.links)

Key Challenge:
Newer Dawn theme versions restrict link_list schema type to single use, breaking the original approach. The workaround involves directly referencing menu handles instead of using schema settings.

Common Customization Requests:

  • Removing sticky behavior from top menu
  • Adjusting background colors and transparency
  • Adding separator lines between menus
  • Controlling font size (solution: modify CSS, e.g., font-size: 16px)
  • Centering menu alignment and padding adjustments
  • Mobile drawer integration
  • Creating dropdown/collapsible menu sections

Current Status:
Ongoing troubleshooting for various users implementing the solution. Recent issues include schema validation errors (“id too long”) when applying code modifications. Users need to share their specific header.liquid code for tailored solutions, as implementation varies by theme version.

Summarized with AI on November 2. AI used: claude-sonnet-4-5-20250929.
26

This is from draft, here is the preview
https://buqgamsd67u9gkve-81817796888.shopifypreview.com

source code is this:

{% comment %}
Renders a standard dropdown style menu for the header.

Usage:
{% render ‘header-dropdown-menu’ %}
{% endcomment %}

{% for block in section.blocks %}
{% if block.type == ‘drop’ %}

Brands {% render 'v-svg' %}
    {%- for link in block.settings.menu_2.links -%}
  • {%- if link.links != blank -%}
    {{- link.title | escape -}} {% render 'icon-caret' %}
    {%- else -%} {{- link.title | escape -}} {%- endif -%}
    • {%- endfor -%}

{% endif %}
{% endfor %}

.our-class-brands{ padding: 12px; } li{ list-style:none; }