In this post, I’ll show you how you can make a full-screen menu with this great animation in your WordPress website by using Elementor Pro. When you hover on the menu items, you will see a cool hover effect. You can link the items in menu to a specific section or any other pages.
First, you need to go to the theme builder and create a Header Template. Create a new section with 2 column layout for the header. Inside the header, add a logo and hamburger menu on the desktop.
Then, we will create another new section and inside it add a horizontal and vertical menu and also the close icon and then design these.
Then, I use some custom code to add the menu toggle functionality and also for some cool animations. We will check it on tablet and mobile devices and make it perfect for all of them.
Get Custom CSS and Javascript used in the tutorial
Get a Discount on Elementor Pro:
BUY Prebuild Template for full-screen Menu(JSON File)
Whatsapp: +92 308 5464371
❤️🔥 Subscribe Now:
Watch More Videos:
➡️ WordPress Speed Optimization:
➡️ Elementor header tips & Tricks:
➡️ Domain & Hosting Setup:
➡️ WooCommerce Tutorials:
➡️ WordPress Complete website creation:
➡️ Elementor Tutorial :
——————————————
Get Discount on Siteground hosting:
Get Discount on Elementor Pro:
Subscribe, Share, Like to get more content from me.
——————————————————————————-
If you have any questions, please feel free to contact me on Facebook.
FB Url:
Twitter URL:
Linkedin:
Email : [email protected]
source