How can I create a desktop-only burger menu?

Store Design
, ,
1

Hello,

I would like to switch my menu to a burger menu, but only on desktop. Unfortunately, my theme doesn’t provide the option to do so, and currently my menu is displayed on two levels, which is not ideal.

Do you have a solution? Either by adding code or finding a way to display the menu on a single line !

Here is my theme: Impact
Here is my site: https://tata-paulette-france.myshopify.com/
Here is the password: mowpre

Capture d’écran 2023-07-12 à 12.58.07.png
Capture d’écran 2023-07-12 à 12.58.07.png2878×366 86.9 KB

1 Like
2

@Matys_hfn
Hello,

.header__secondary-nav .header__link-list {
	display: none;
}
.lg\:hidden {
	display: block !important;
}
.header__link-list.wrap {
	display: none;
}

Add This CSS GO to online store > Select theme > Edit Code > theme.css

Like This

oscprofessional_0-1689159877630.png
oscprofessional_0-1689159877630.png1651×812 151 KB

3

Hey @Matys_hfn

Follow these Steps:

  1. Go to Online Store
  2. Edit Code
  3. Find theme.liquid file
  4. Add the following code in the bottom of the file above tag

Moeed_0-1689161003463.png
Moeed_0-1689161003463.png1903×286 42.1 KB

If I managed to help you then, don’t forget to Like it and Mark it as Solution!

Best Regards,
Moeed

4

@Matys_hfn

Please add the following CSS code to your assets/ theme.css bottom of the file.

.header__secondary-nav .header__link-list {
	display: none;
}
.lg\:hidden {
	display: block !important;
}
.header__link-list.wrap {
	display: none;
}

Thanks!