Mobile only menu not working after upgrade

[cindywho]

Hi There,

When I try to update to current X theme my “hamburger”/mobile menu no longer works. Currently I am using the mobile only navigation on all platforms. I restored my site to the older Xtheme version and it works fine. Would like to upgrade but need the mobile only menu. This code works on Xtheme version 5.2.5 but not 6.1.6:

/* Enable Mobile Navbar on Desktop */
.x-navbar {
text-align: Center;
}

.x-navbar .desktop {
display: none !important;
}

.x-navbar .x-btn-navbar {
display: inline-block;
}

.x-nav-wrap.mobile.collapse.in {
display: block;
}

.x-nav-wrap.mobile.collapse {
display: none;
}

.x-nav-wrap.mobile {
display: block;
}
.x-breadcrumb-wrap {
background-color: rgba(255,255,255,255);
}

any help would be greatly appreciated.

[Prasant]

Hello @cindywho,

Thanks for asking.

Looks like you forgot to share the website URL. That being said, it’s not recommended to change the CSS for mobile nav so that it’s visible in the desktop. Always there is a probability of things breaking when there is an update. Also it falls outside the scope of support we can offer for custom CSS or JS codes.

To have hamburger menu, I would suggest you to take a look at Uber menu. You can install Uber Menu from X > Validation > Extensions. To help you get started with Uber menu I am sharing few resources that can be looked at:

UberMenu | Themeco Docs

https://sevenspark.com/docs/ubermenu-3/video-tutorials

https://sevenspark.com/knowledgebase/docs/ubermenu-3-2

Thanks.

[cindywho]

Added URL to secure notes but assume not necessary since it’s outside of support now. I will investigate Uber menu and in the mean time stay with the older version of X

[basanta]

Thanks for your understanding!