How can I hide a header section on mobile view?

korrynf · ‎03-19-2024

Hello,

For some reason the current code I have to hide a second header in mobile, isn't working anymore. I am trying to hide the menu below the announcement bar "Free Shipping on orders over $100". I want to hide that second hamburger menu.

This is the current code that is not working:

Can someone help?

Thank you!

Dan-From-Ryviu · ‎03-20-2024

Hi @korrynf

You must update that code to this to make it work

<style>
@media (max-width: 749px) {
#shopify-section-header2 { display: none !important; }
}
</style>

- Helpful? Like & Accept solution! - Support me? Buy me a coffee
- Ryviu - Product Reviews & QA app: Collect customer reviews, import reviews from AliExpress, Amazon, Etsy, Walmart, Dhgate and CSV.
- Lookfy Gallery: Lookbook Image - Gain customers with photo gallery, video & shoppable image.
- Reelfy‑Shoppable Videos+Reels: Create shoppable videos to engage customers and drive more sales.
- Enjoy 1 month of Shopify for $1. Sign up now.

View solution in original post

Hardik29418 · ‎03-20-2024

@korrynf Please provide website url

- Need a Shopify developer? Chat on WhatsApp or EMAIL ME!

- Your Coffee Tip would do Magic code ❤️
- For Shopify Design Changes | Shopify Custom Coding | Custom Modifications
- Email

korrynf · ‎03-20-2024

Thedenimlab.com

Hardik29418 · ‎03-20-2024

Please go to
1) Online store
2) Themes -> Edit theme
3) Layout
4) theme.liquid and paste this code before </head>

<style>
@media only screen and (max-width: 767px) {
  #shopify-section-header2 {
    display: none !important;
  }
}
</style>