Need help setting up the menu on the mobile version to be side loaded vs dropdown

Support
#1

Hello,
I have a developer building my website using this theme and we currently have the desktop view setup the way we want but we cannot get the menu icon the way we want.

We would like it to be on the left side of the menu, have white hamburger lines with no background, and sideload the menu instead of dropping the menu down.

Here is what it currently looks like:


As you can see, it looks pretty terrible. What we’d like it to look like is this:

And when the hamburger is clicked on, we’d like the menu to side load like this instead of dropdown:

The desktop currently looks like this and we’d like this to stay the same. Is it possible to make the changes above on mobile while keeping desktop the same?

#2

Hello @Zuluster,

Thanks for asking. :slight_smile:

Yes, absolutely. You can sideload the menu on mobile on a click effect and not let it show up on Desktop. I suggest you to use Superfly menu plugin that we ship as a bundled extension along with X Theme. Superfly menu has feature built in wherein you can have slide in menu and display only on mobile devices. Please note that upon installing extension from X > Overview > Extensions > Superfly menu, you need to active the extension under Activate tab. I suggest you to first refer our knowledge base article as it has all the necessary details to help you get started. I also found video on YouTube that you can refer.

Please note that Superfly menu won’t replace the default X Theme menu. To hide default X Theme menu on mobile, ask your developer to add following CSS under X > Launch > Options > CSS:

.x-btn-navbar, .x-btn-navbar.collapsed {display: none;}

Thanks.

#3

Thank you! This did the trick.

#4

You’re most welcome.

#5

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.