Hide menu link in mega menu when product counts = 0

In header-mega-menu.liquid, search

{%- for childlink in link.links -%}

Add the following below:

{%- if childlink.object and childlink.object.products_count == 0 -%}

                      {%- continue -%}

                    {%- endif -%}

Then, search

 {%- for grandchildlink in childlink.links -%}

Add the following below:

{%- if grandchildlink.object and grandchildlink.object.products_count == 0 -%}

                              {%- continue -%}

                            {%- endif -%}

• Related Articles

• Make parent link clickable

  Snippets > header-mega-menu.liquid (l.19-25) Parentlink {%- assign parentlink = link.links[0] -%} <a href="{{ parentlink.url }}" title="{{ parentlink.title }}"> <span {%- if link.child_active %} class="header__active-menu-item" {% endif %} > {{- ...

• Make mega menu show only collection that consist of products

  In header-mega-menu.liquid and header-drawer.liquid, add the followings: {%- if childlink.object and childlink.object.products_count == 0 -%} {%- continue -%} {%- endif -%} and {%- if grandchildlink.object and grandchildlink.object.products_count == ...

• Reduce menu link padding in the footer

  In the footer section, add the following in the custom css: .list-menu__item--link { padding: 0px; }

• Make Mega Menu Second Child Horizontal

  In the header, add in custom css as below: @media screen and (min-width: 990px) { .header--top-center .mega-menu__list { display: flex; justify-content: left; flex-wrap: wrap; column-gap: 0; } #MegaMenu-Content-1 .mega-menu__list li:nth-child(2) ...

• Highlighting one menu link with a distinct color

  In the header, add in custom css as followings: a[href^="/pages/contact-us"] {color: #33ff00 !important;}