Single Page Scrolling Elementor Menu (Desktop & Mobile Anchor Scroll Menus)

✨ Join us in the Lytbox Academy Community:
lytboxacademy....
🔗 Link to Code Snippet 👇
lytboxacademy....
/////
✨ Learn High-Level Web Design Skills With Me:
🟢 Master Elementor while learning web design skills:
lytboxacademy....
🟢 Learn powerful SEO in an easy-to-follow style for WordPress users and web designers:
lytboxacademy....
🟢 A step-by-step guide to building a WordPress Maintenance Business that results in high MRR:
lytboxacademy....
🟢 Become a Lytbox Academy Pro Member:
lytboxacademy....
/////
✨ My Recommended WordPress & Web Design Tools:
👉 The hosting I use:
Cloudways (use promo code LYTBOX for 30% off 3/months)
lytboxacademy....
xCloud:
lytboxacademy....
/////
👉 My WordPress Tools:
Elementor Pro:
lytboxacademy....
Breakdance Builder:
lytboxacademy....
Bricks Builder:
lytboxacademy....
Crocoblock:
lytboxacademy....
SEOPress (the best SEO tool for WordPress!):
lytboxacademy....
Perfmatters:
lytboxacademy....
InstaWP:
lytboxacademy....
WP Umbrella:
lytboxacademy....
/////
TIMESTAMPS:
1:23 Built Anchor/Jump Menu
5:25 Build Slide Out Mobile Menu
12:35 Connecting Pop Up Menu In Mobile Menu
14:38 Auto-closing Mobile Anchor Links
15:12 Adding the Code Snippets
17:50 Using Icon List and Buttons
19:24 Outro
Thank you for supporting my channel 🙏 - Jeffrey @ Lytbox
#elementor #elementortutorial #elementormenu

[@christianhimmer]

Thank you so much for this. I love your tutorials. I use this code in a html widget inside the popup:
jQuery(function($){
$(document).on('click','.elementor-location-popup a', function(event){
elementorProFrontend.modules.popup.closePopup( {}, event);
});
});
and for me it work.

[@LytboxStudio]

Good one! I’m pinning this comment so others can use it. Thanks and cheers!

[@JP-jf6bt]

Yes please, make a video about mobile menu styling! ❤

[@LytboxStudio]

You got it!

[@catintheboxco]

looking for the video!!! @@LytboxStudio

[@zexusub4412]

I'm a persion but I understand all of the words you're saying better than my language.
legend for ever💎

[@LytboxStudio]

Thanks!🙏

[@samwillun]

You're an absolute creative genius! Thank you so much for your teachings, which have opened up new realms of knowledge for me. If you have any further amazing insights on responsive navigation and page design for mobile devices, I would be thrilled. Once again, thank you, Master Jeffrey, for your exceptional guidance!

[@LytboxStudio]

Hey thank you so much! I do have plans for more mobile designs coming up 😉

[@asad-zaman-digital-marketer]

Your tutorials are great, ❤ i was exactly looking for this for the jump section I have created for one of my websites using a popup menu.

[@JohanHeyns]

This tutorial is great thank you. It works really well with a site I have created. I would like to add additional pages to the site. What process would you suggest I follow to do this? Thanks in advance

[@MiStiQueT]

such an underrated channel!

[@farhanmirza8329]

I love your videos you're doing great work for new WP Designers like me
you deserve millions of subscribers❤ keep up the good work👏
moreover don't forget to make a video for the mobile menu...

[@LytboxStudio]

Wow thanks! I really appreciate this. And I got more mobile menu focus content on the calendar 📅

[@carolynemoolenschot2907]

Thanks for this! Quick question; will blockers block the pop menus?

[@jasembaji4704]

thank u for ur good teaching i wish best for u if u can do more mobile menu

[@LytboxStudio]

For sure!

[@marty9404]

You're a lifesaver mate!
Godspeed!

[@jonicevangemert3483]

Thank you so much! This tutorial has helped me allot. Do you have any tips on how to make the header stay in place? I've already made the section Sticky in Header editor in appearance

[@LytboxStudio]

Thank you! Is the header not sticking when the main section/container is set to sticky?

[@jonicevangemert3483]

Thank you for answering. Unfortunately it doens't. I'm using the royal addons for it (since i don't have elementor pro). No matter what settings i'm using, the header keeps disappearing when scroll down the page. Do you know if there is a different free option for doing this. @@LytboxStudio

[@jonicevangemert3483]

I did it! Installing sticky header effects for elementor did the trick. @@LytboxStudio

[@inertingd373]

Hey, first time I see your Chanel and video ; I was looking for a specific menu trick, but I couldnt quickly scan through ur video to understand the final result of what you were doing ; maybe you could highlight that with the features provided by TH-cam, so that people can quickly go to a section where it says "Menu preview" ; until now I don't know what is this menu about because I have to go through so many videos like yours to find what I'm looking for
Just an advice from someone scanning multiples videos
good luck, your work seems to be super qualitative anyway, have a nice day

[@LytboxStudio]

You might have missed it but I show the end result in the first 30 seconds so you know what to expect to achieve.
But hey, when I’m trying to figure something out and have to go through several videos and blogs, I always learn much more 😉

[@donatasp.]

How would you describe your experience switching from elementor to bricks?

[@LytboxStudio]

I have an upcoming video taking a look at my experience 😉

[@WickyDesign]

Nice tutorial!

[@LytboxStudio]

Thanks Mark! 💪

[@exegonzalez8562]

Thank you so much! its awesome!
Just a noob question, can I have a popup menu just for mobile? and no popup menu for Desktop? how setup that?
Thanks

[@まめ-p3w]

yes. make 2 menu, and by settings no show by resposive each.(for mobile,no show to desktop)

[@fatjay9402]

Can you show how to make a Mobile Menu in the popup with the new mega Menu. because ... if you have sub menus ..it simple doesnt work

[@LytboxStudio]

That’s a really good idea. Now that Eli’s mega menu has had time to settle, I’ll explore more tutorials on it.

[@fatjay9402]

@@LytboxStudio Thanks ! looking forward to it

[@candy_front]

thank you a lot !!!!!!

[@LytboxStudio]

Thanks 🙏

[@まめ-p3w]

sooo genius!!!!

[@ioannapanali7576]

Thank you so much!

[@LytboxStudio]

Your welcome!🙏

[@AIMANJASMIN]

How to add active class into the menu when we click the menu or scrolling the id section?

[@LytboxStudio]

I think this will take a little js

[@toplayfantasy]

Mobile menu style Please
Sir

[@LytboxStudio]

I’ve added a few mobile focused videos showing the design processes 😉

[@jasembaji4704]

mobile menu for websit

[@LytboxStudio]

Let’s do it!

[@MrMairu555]

Please put "Elementor Pro" or "Elementor Free" in the title in future.

[@LytboxStudio]

Can’t do it. There’s only so much us content creators can put in a title and asking to put Elementor Pro or Free in titles is unrealistic.
Everything I do is Elementor Pro. I don’t recommend trying to only use the free version. That’s only meant for testing.
You’ll need Pro for popups, headers and footers and so on.
For this tutorial, you can still learn how to create single page scrolling menus for desktop and use it on the free version.

[@websquadron]

@@LytboxStudioWell said :)

[@vanepastor]

Thank you so much!!

[@LytboxStudio]

Thanks! And awesome emoji/sticker 😅