Remove menu arrows in header
- From your Shopify admin dashboard, click on "Online Store" and then "Themes".
- Find the theme that you want to edit and click on "Actions" and then "Edit code".
- In the "Assets" folder, click on "base.css, style.css or theme.css" file, depending on which file your theme uses to store its CSS styles. At the bottom of the file, add the following CSS code:
svg.icon.icon-caret {
display: none;
}
summary.list-menu__item {
padding-right: 1.2rem !important;
}
Related Articles
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 ...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) ...Remove the header and footer from a specific landing page
Add this code before </body> tag in your theme.liquid file: {% if page.handle == 'x' %} <style> .header, footer {display: none;} </style> {% endif %}Removing country/selector from mobile drawer menu
From your Shopify admin dashboard, click on "Online Store" and then "Themes". Find the theme that you want to edit and click on "Actions" and then "Edit code". In the "Assets" folder, click on "base.css, style.css or theme.css" file, depending on ...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 == ...