Hide a menu item on mobile only

Highlighted
New Member
4 0 0
Hi There,

Hope someone knows the answer to this.
I am using the prestige theme and I would like to hide one specific menu item on mobile but keep the item on desktop.

Is this possible?
0 Likes
Highlighted
Navigator
252 36 40

Hello @Leoo 

 

We have to edit menu item from backend.
Please edit Menu Item NAME to '<span class="hide-mobile">NAME </span>'

 

-> Go to Online Store -> Theme -> edit code
-> asset -> theme.scss.liquid

 

Add below css lines at bottom of code

@media only screen and (max-width: 749px)
	.SidebarMenu__Nav .hide-mobile {
              display: none !important;
	}
}
Expert Shopify Developer hire me
Still not satisfied!!! contact me
Is it good solution? Yes, please Like.
0 Likes
Highlighted
New Member
4 0 0

Hi Excursionist, Thank you for reaching out! 

 

I have added the lines in the theme.scss.liquid but can you tell me where to change the <span class> ?

 

Thanks a lot!

0 Likes
Highlighted

@Leoo,

Please share your site url so that I will give you exact solution

Want to modify or incorporate custom changes on store, Hire us
If helpful then please Like and Accept Solution .
Email: pallavi@oscprofessionals.com
Skype : oscprofessionals-87
Whats app
Free Website Review and advice for sale from Shopify Conversion Experts | Shopify Private App | Custom Theme Development | Custom Modifications In To Shopify Theme | Shopify SEO ; Digital Marketing & amp | Site Speed Optimization | Performance Site Audit
0 Likes
Highlighted
Navigator
252 36 40

Please see below pic for where to add 'span'.

 

Untitled.png

Expert Shopify Developer hire me
Still not satisfied!!! contact me
Is it good solution? Yes, please Like.
0 Likes
Highlighted
New Member
4 0 0

Hi Explorer, Thanks again for helping me out. I've tried everything to make it work, but it didnt. ;)

I have added the span-line into the navigation, and added the lines into the liquid file, i tried several combinations but it won't work. Could it be the theme? 

 

 

 

 

So i have added the line into the navigation item below: 

 

 

So, i have added the line into the navigationSo, i have added the line into the navigation

Then i have added the lines to the theme.scss.liquid

and added the line of css into the theme.scss.liquidand added the line of css into the theme.scss.liquid

 

 

 

And this was the outcome,

but this is the outcomebut this is the outcome

0 Likes
Highlighted
Navigator
252 36 40

Hello @Leoo 

 

Please contact me personally, I will make it work.

Expert Shopify Developer hire me
Still not satisfied!!! contact me
Is it good solution? Yes, please Like.
0 Likes
Highlighted
New Member
2 0 1

Would have been great to see the solution made public!