How to Build a Custom Website Menu Using Elementor

How to Build a Custom Website Menu Using Elementor

I’m going to show you how I created this simple menu for Reboot & Co. Let’s dive in!

Step 1. Create a new template in Elementor

Step 2. Add a new Section and choose your column layout

Click the plus (+) icon
Select your number of columns & layout

Step 3. Drag & drop your “Site Logo” and “Nav Menu” widgets where you want them

*You can set up your Site Logo within Elementor by clicking the menu option in the very top left and navigating to Site Settings > Site Identity.

Step 4. Set your menu and play around with the settings

*Make sure to set up your menu in WordPress so that it will show up here. In this case, mine is called “Main Nav”. (You can find yours under Appearance > Menus)

Step 5. Edit your Section settings to adjust the height & width of your menu

Click on the 6 dot grid to access your Section’s settings.

*You can adjust these to whatever you want, but these are the exact settings I used for Reboot’s menu.

Step 6. Publish your menu & set the Display Settings

*Typically, “Include > Entire Site” is what you will need. If there are specific pages you don’t want your menu to show up on, you can select “Exclude” and define those here.

Ta-dah! You’re done! 🎉

If you haven’t already tried Elementor…what are you waiting for?! Click here to check it out.

Leave a comment

Your email address will not be published. Required fields are marked *

Thanks for reading! :) 


P.S. If you found this post helpful, you can buy me a coffee here ☕️

Save or share this post: