How to Create Sticky Menu Using Elementor Mega Menu Widget

A Sticky menu is a menu that stays at the top of the page while the user scrolls through it, making it quicker to navigate between website pages.

You can use it with our Elementor Mega Menu widget to create a sticky horizontal menu on your WordPress website. The Premium Mega Menu widget from the Premium Addons for Elementor plugin helps you to build custom menus or use WordPress menus.

In case you’re not familiar with the Mega Menu widget please take a look at this article.

First, you should assign CSS ID “pa-sticky” to the Elementor Mega Menu parent section from the Advanced tab.

Assign CSS ID to Elementor Mega Menu Parent Section
Elementor Mega Menu Parent Section ID

Then, navigate to your Mega Menu widget -> Display Options then enable the sticky menu option, and set the Sticky Target ID to “pa-sticky”.

  • Enable Sticky Menu: Switch on to stick menu to the top while users scroll through the page.
  • Sticky Target ID: Insert menu parent section CSS ID to make it apply a sticky effect it. The target ID to apply sticky effect on ( without the “#” ).
  • Sticky on Scroll Up: Enable to only show a sticky menu when scrolls up.
  • Disable On: Select on which devices you want to disable the sticky menu.
Sticky Elementor Mega Menu option

Well Done!

If you still need any further assistance, feel free to contact the Premium Addons support team. We would be more than glad to help 😁

Related Docs:

Leave a Reply

Download Now it's free!

Extend your Elementor Page Builder capabilities now with Premium Addons. 44+ Elementor Widgets Totally Free of charge.

Premium Addons for Elementor plugin logo

Stay Updated

Subscribe to our newsletter to receive the latest updates and features.