Hello!
I created an item for the menu, but hid it in the main menu so that it would only display on mobile. The code I added worked to hide the item on the homepage, but it is appearing on all of the other site pages.
Here is the CSS I added:
#avia-menu > li:last-child > li a {
display:none !important;
}
Can you help me figure out why it is not being hidden on all pages?
Site linked in private content.
Thanks so much!
Actually, I didn’t want to leave this up on our live site, so I added it to the dev site.
But now it’s not hiding it even on the home page.
I also did this for another button – client wanted a “Home” menu on the mobile menu but not on desktop. I was able to get that to work, but no luck with the “Cart” menu item.
Link in private content below.
Thank you so much!
Hi,
Thanks for the update. Which menu item are you looking to hide for desktop only?
Best regards,
Rikard
Hi Rikard –
I would like to hide the “Cart” menu item on only desktop so that it shows up in the mobile menu.
Thanks so much!
Nikole
Hi bewelltended,
Can you disable caching and minification for now so that we can work with the CSS in the browser?
Best regards,
Victoria
Hi Victoria –
I have disabled our WP Rocket plugin. Let me know if that didn’t do the trick.
Thanks so much!
Nikole
Hi Nikole,
NO, the styles are still inlined in the HTML file. Are you using another plugin maybe as well?
Best regards,
Victoria
Hi Victoria –
Thanks for the update. I disabled any that I felt could still be causing an issue. Any better luck now?
N.
Hi,
Please try the following in Quick CSS under Enfold->General Styling:
nav.main_menu #menu-item-3655 {
display: none;
}
Best regards,
Rikard
That worked perfectly, Rikard. Thanks so much for your help. You can close this ticket now.
I really appreciate the help!
Nikole
Hi bewelltended,
Glad we could help :)
If you need further assistance please let us know.
Best regards,
Victoria