Header Menu Issues - How to remove a section for ipad

Solved
mattpermute
Excursionist
47 0 20

Hello,

I am having some formatting issues with my header menu, I need the 'refer a friend' tab on the header to be removed when the user is on an ipad or tablet.

Please refer to the attached image for reference

shop link: french-bazaare.myshopify.com

Let me know if there is an easy way to fix this!

Thanks

MM

Screen Shot 2021-09-16 at 1.15.59 PM.png

0 Likes
Nick_Marketing
Shopify Partner
692 170 202

This is an accepted solution.

Hi,

Try adding this code to the bottom of style.scss.css

 

@media only screen and (min-width:769px) and (max-width:899px){
.refer-a-friend {
  display: none;
}  
}

 

 

- I am an eCommerce and Marketing Technology consultant based in Toronto, CANADA.
- To inquire about consulting work availability, please send me a Private Message.
- For Shopify Tutorials, Subscribe to my YouTube Channel.
0 Likes

Hi @mattpermute ,

Hope you are well.

Please follow the below steps:

  1. Go to Online Store->Theme->Edit code
  2. Asset->/styles.scss.css
  3. Paste the below code at the bottom of the file & Click Save
 @media (max-width: 1024px) {
.refer-a-friend {
display:none!important;
}
}

Hope that helps

Thanks

- Want to modify or custom changes on store Hire me.
- Feel free to contact me on prasanna.mahamulkar@gmail.com regarding any help.
- If helpful then please Like and Accept Solution.
Shopify Frontend Web Developer | Whatsapp Me
0 Likes
mattpermute
Excursionist
47 0 20

Thank you this worked like a charm!

Nick_Marketing
Shopify Partner
692 170 202

@mattpermuteI am glad the issue is solved.
P.S. great looking website!

- I am an eCommerce and Marketing Technology consultant based in Toronto, CANADA.
- To inquire about consulting work availability, please send me a Private Message.
- For Shopify Tutorials, Subscribe to my YouTube Channel.
0 Likes