Moving Burger Menu - Impulse Theme

Store Design
, , , , , ,

Topic summary

A user seeks to reposition the burger menu icon to the left of the logo in the Impulse theme by Archetype.

Proposed Solution:

  • Add custom CSS to the theme.liquid file before the </body> tag
  • The CSS uses media queries to absolutely position the navigation icon on mobile devices (max-width: 768px)
  • Includes adjustments for header layout width and alignment

Current Status:

  • The suggested CSS solution did not work as intended
  • The menu icon remains in its original position
  • The user notes their theme includes a header-icons.liquid snippet file that controls icon arrangement order, which may be relevant to achieving the desired result

The discussion remains unresolved with the initial fix unsuccessful.

Summarized with AI on November 3. AI used: claude-sonnet-4-5-20250929.
1

Hi, I would like to move my burger menu to left begore the logo. The theme is impulse by archtype.

Our website is algreenproducts.com

Thank you in Advance.

AlgreenSM_0-1732401964871.png
AlgreenSM_0-1732401964871.png505Ă—737 218 KB

1 Like
2

Hi @AlgreenSM

Try this one.

  1. From your Shopify admin dashboard, click on “Online Store” and then “Themes”
  2. Find the theme that you want to edit and click on “Actions” and then “Edit code”.
  3. In the “theme. Liquid” file. Find the tag and paste the code below before the tag.
@media only screen and (max-width: 768px){
.site-nav__link.site-nav__link--icon.js-drawer-open-nav {
    position: absolute;
    left: 17px;
}
.header-layout.header-layout--left-center {
        width: 96%;
        justify-self: self-end;
    }
}
@media only screen and (max-width: 600px){
    .header-layout.header-layout--left-center {
        width: 90%;
    }
}

Your Feedback Matters! Please mark the solution and give likes to posts that helped you. Your appreciation fuels our motivation to assist you better!

3

Hello, I tried it, but it is not giving me desired result. The menu is staying at the same place. also, Please note I also have this file in my theme code. which arranges icon in order.

snippets/header-icons.liquid