Mega Menu Mobile

Hi there, I hope you are doing well. Before purchasing the theme I was told I can do mega menu in mobile. I am trying to achieve this but not succeeding.

I have created the HTML block and made it responsive too with my design. it works well on desktop but when I use the “side bar” category menu, it does not allow the menu to “open” to the side.

Any help to achieve this please?

Thank you.

Sorry please see website details in the moderator section.

Hello,

The mega menu is available only for the desktop which is why the mega menu is either hidden or disabled for mobile devices.

Let me know if you have any additional questions.

Kind Regards

Thanks for clarifying this.

Do you have any suggestions on how I could incorporate a mobile mega menu with your theme? I have Ubermenu plug-in which allows for custom shortcodes but it does not seem display the shortcode of my elementor mega-menu at all.

Thank you.

Hello,

Sorry to say but right now there is no option in Theme Settings available for that. It requires Customization and this is beyond our limitations and support policy scope. Hope you can understand our limitations.

Kind Regards

Hi Luke, I was looking at the header builder and it seems like if you have an HTML block, your theme says it will make it a sub-category. Please see screenshot attached.

I have created an HTML block (2nd screenshot) attached and put it in the “Sticky Nav menu” but when I view on mobile it does not work as the way it shows in the preview.

This means an HTML block mega menu is possible natively.

Thank you, please assist.

Attachments:

You must be logged in to view attached files.

I figured it out – you can use mega menu in mobile. Just enable “Show HTML Block” in the header builder and it will allow you to have a mega menu.

Lastly, my mega menu – menu item called “Cardio” uses an HTML block. therefore when I click on “CARDIO” in the menu, it opens a page which is basically the HTML block widget. How can I change this so it opens the product category instead of the HTML block?

Attachments:

You must be logged in to view attached files.

Hello,

I see that you use some plugin for the menu items, try to define the link to that category manually here – https://prnt.sc/KAfDQXROf2op

Or create a menu item using the “product categories” here – https://prnt.sc/lW1YAm9LDOnf, add an item from there and assign that HTML Block, clear the cache and recheck the issue.

Kind Regards

Hello, sorry but I don’t think you can add HTML blocks to product categories.

I removed the Ubermenu plug-in – can you check now and tell me how to do what I need please?

Thanks

Hello,

Create a menu via the custom link and then assign the desired URL there. Check the menu and you will see this example – https://prnt.sc/Rn1Yv46OErpu

Let me know the result.

Kind Regards

Thanks Luke, that worked.

On mobile/tablet menu, when I click the menu button it opens the menu using off-canvas sidebar. But it does not open the full-width of the screen, instead there is black opacity to the right.

Is this CSS code fine to increase off-canvas menu size or do you have suggestions for improvement on CSS?

@media (max-width: 1024px)
.wd-side-hidden {
–wd-side-hidden-w: min(90%);
}

Thank you,

Hello,

Send some screenshots for a better understanding, please.

Looking forward to collaborating with you!

Kind Regards

Hi Luke, I actually used this css in the mobile & tablet CSS section –

/* Increase tablet & mobile menu canvas size when menu open */
.wd-side-hidden {
width: 90%;
}
.wd-nav-mobile.wd-html-block-on .wd-mob-nav-html-block {
max-width: 98% !important;
}

Can you help me centre the text of the heading and sub-headings in the screenshot I attached, please? I have this CSS already but it seems to not be working well on mobile page –

/* Centres Extra List Menu items */
#extra-menu-list-center-subtitle-text .wd-sub-menu li>a {
justify-content: center;
}

Thank you.

Attachments:

You must be logged in to view attached files.

Hello,

Add the “text-align: center” value for your custom code – https://prnt.sc/s-fcY3kxiY7j

Then the title will be in the center.

Kind Regards

[Author]

Posts