MENU

Fun & Interesting

Elementor Mega Menu Tutorial | Without Plugin πŸ‘‰ Just Elementor PRO

Video Not Working? Fix It Now

How to create a mega menu with Elementor PRO full tutorial (without plugin). Subscribe to WP Roads newsletter πŸ‘‰ https://wproads.com Get Elementor PRO πŸ‘‰ https://wproads.com/elepro *Check my full Elementor PRO tutorial* πŸ‘‰ https://wproads.com/eletutorial *My Other Elementor Tutorials* 1. How to create a Slide In Mobile Menu πŸ“² using Elementor Popup Builder πŸ‘‰ https://www.youtube.com/watch?v=gVjyLtg3zEk 2. How to create a 404 page 🧐 with Elementor PRO πŸ‘‰ https://www.youtube.com/watch?v=kbQ-WusYvCU 3. How to create custom Headers πŸš€ using Elementor PRO πŸ‘‰ https://www.youtube.com/watch?v=bAOVISGbBS0 Timestamps 00:00 Let's create a Mega Menu with Elementor PRO 00:17 Pascal creator of WP Roads (SUBSCRIBE!) 00:34 Quick preview of the mega menu we are going to create 00:57 Experimental features needed (menu and nested elements) 02:04 Creating a basic header for our example If you need a full Elementor header tutorial you find it here πŸ‘‰ https://www.youtube.com/watch?v=bAOVISGbBS0 02:38 Follow my full Elementor PRO header tutorial 02:50 Quick styling of our header 05:04 Setting the Elementor Menu widget 05:41 Activating Elementor dropdown option in the Menu widget 06:12 Adding the content to the dropdown mega menu 07:03 Styling the mega menu width 08:20 Distance from the header 08:55 Setting the padding pf the main mega menu container 09:13 Adding a grid container 11:04 Creating a CTA inside the grid container 13:00 Make sure to see correctly the dropdown icon 13:37 Align content inside the grid container 13:55 Styling the main container (border and shadows) 14:44 Adding border shadow to the main header 15:10 Adding an icon to link the mega menu to the header 17:23 Styling the list item at the top of the mega menu 18:08 Check out my ultimate Elementor PRO tutorial 18:36 Quick styling of the list icon element 18:43 Replace the content inside the grid container 19:24 Change the dropdown indicator icon 20:03 Responsive optimisation of the mega menu 20:18 Assign a different menu in mobile with Elementor Popup builder Watch my full tutorial on how to create a slide-in mobile menu using Elementor PRO popup builder https://youtu.be/gVjyLtg3zEk 20:42 Basic responsive optimisation of the dropdown mega menu 22:21 Change the grid container items on tablet and mobile 23:20 Open the dropdown menu on hover or on mouse click 25:33 Optimisation for mobile replacing the menu toggle position 26:48 Share your feedback in the comments! 27:01 Check out my Ultimate Elementor PRO tutorial And remember to subscribe to my Newsletter! ❀️ πŸ‘‰ https://wproads.com #elementor #elementortutorial #megamenu #wordpress #wproads

Comment