Thanks for the tutorial. Very helpful! One question. Is it possible when the pop-up slides in to push the content of the page to the right and not overlay it? Thanks again and keep up the good work!!!
Love your tutorials! Saved me from going mad several times. I have a question - can you create a flyout sidebar with a vertical tab that follows you down the page?
Thank you for the tutorial. Maybe you can advice .. I have a one pager site so in my case I want to close the menu when clicking on a menu item - is that possible.. how ?
Hello I would love to know how to make the popup menu transparent so one can see the hero image when it slides in. Love your videos but I am not getting a response to this question from elementor
How could I have the icon/button that toggles the Popup menu on/off screen be attached to the side of the menu? So it looks like it’s part of the menu. Hope that makes sense 😅
Hey great tutorial! I followed all the steps, but I encounter an error when on mobile and I scroll down, the pop up moves off the top of the screen. Seems like i cannot make it fixed. Any reccomendations?
@@websquadron Yes I did. You know when you have a fixed header, no matter wheather you scroll harshly it stays on top. With the popup the content moves up and down. Please don't get me wrong, the actual pop up is not scrollable, it happens when I scroll through the website.
Thanks for this very very useful tutorial 🙏🙏 I have a menu which includes sub-menu, but nothing happens when I click on iteme, it doesn't show sow sub-menu, is there any solution for that?
Hey man! I've been looking for a solution to have off canvas content with extended information of products, however...these are still popups, So when most people with adblockers get in and try to open that - it won't show, right? How would you get around that?
I just realized that each time i click on my hamburger menu of my pop up menu, my website page always automatically scroll to top of the page ? Any idea why ? Help will be much appreciated ? :)
@@websquadron hello, i did. I solved the issue by changing the overflow to hidden in the pop up setting. Cheers! Thank you, i really appreciate your response. :)
I'm working on a website which has tabs, sub tabs and sub sub tabs. One main tab of mine has 5 sub tabs, out of which each sub tab has an additional 5/8 sub sub tabs. Is a full width off canvas menu advisable in this case, or a mega menu? Sorry if it's a noob question. Just trying to learn.
Mega Menu would work well for desktop. But an off canvas on mobile would be better and you could use accordions so that it shows the other sub items in a more concise way
How to make the popup "push" the whole page over. Use case is a chat window. User can do whatever on popup and still see and do whatever on main site. Cheers.
Scrolling your video tutorials when stuck, it is always high level to solve my problems . Love and respect 💓 brother. But according to one page layout when I use offcanvas popup menu, when click on link item , the pop don't go off untill I click outside or close button. Any solution for that , once I click anywhere in popup link it take to the navigated section n popop close 👍
The button is not working for me, any reason why? I have another website that I did this for and there were no issues, but for some reason I have all kinds of console errors with this site.
@@websquadron No but i set the pop-up animation for the desktop version to default and after that i tried the animation on both tablet and phone devices and it worked just fine, It's weird but if it works it works
@@websquadron However i tried to set an entrance animation for an icon that open a menu for the phone but the problem is that the animation triggers not only the icon but even the drop-down menu! Is there a way to prevent that from happening and is there a way to set the duration for the animation to let's say 10sec?
Great 👍 but dud I need a help I have an video on my site and i m using ultimate memeber plugin.Now once I click on that video I want to play that but if user is login in else not.
Thanks a lot. I succeeded to create my sidebar off-canvas popup menu following your tutorial
Nice work!
My websites keep improving because of you. Most underrated channel on youtube! Thanks man!
Your tutorials are perfect, quick and relevant. Thanks mate!
Thank you so much Sir, I have added it in my project, take respect from Bangladesh.
Thanks for the tutorial. Very helpful! One question. Is it possible when the pop-up slides in to push the content of the page to the right and not overlay it? Thanks again and keep up the good work!!!
I need to check but there was a way to do that.
Love your tutorials! Saved me from going mad several times. I have a question - can you create a flyout sidebar with a vertical tab that follows you down the page?
Yes, if you then make it be a sticky top.
Thank you for the tutorial. Maybe you can advice .. I have a one pager site so in my case I want to close the menu when clicking on a menu item - is that possible.. how ?
th-cam.com/video/h6oI1rg1PA8/w-d-xo.htmlfeature=shared
@@websquadron wow!!! perfect :) Thank you so much, you are really the best!!!
@@websquadron Thank you so much!!! you are the best
Hello I would love to know how to make the popup menu transparent so one can see the hero image when it slides in. Love your videos but I am not getting a response to this question from elementor
You could change the overlay or the container BG transparency.
How could I have the icon/button that toggles the Popup menu on/off screen be attached to the side of the menu? So it looks like it’s part of the menu. Hope that makes sense 😅
That would need further work, and I would need to think about that.
hey websquatron, I am watching your video from Bangladesh.
Another fab tutorial, but having issues with submenu being wonky. Just seeing a tad bit of it off to the left of the nav menu.
Wonky? Maybe add some padding?
I am assuming here and could be wrong
Hey great tutorial! I followed all the steps, but I encounter an error when on mobile and I scroll down, the pop up moves off the top of the screen. Seems like i cannot make it fixed. Any reccomendations?
Have you made it VH 100?
@@websquadron Yes I did. You know when you have a fixed header, no matter wheather you scroll harshly it stays on top. With the popup the content moves up and down. Please don't get me wrong, the actual pop up is not scrollable, it happens when I scroll through the website.
Thanks for this very very useful tutorial 🙏🙏
I have a menu which includes sub-menu, but nothing happens when I click on iteme, it doesn't show sow sub-menu, is there any solution for that?
It should show it unless you’ve got some major optimisation happening that affects the submenu drop down.
@@websquadron I have the same problem with the sub-menu's, can you explain what you mean by major optimisation please.
Hey man! I've been looking for a solution to have off canvas content with extended information of products, however...these are still popups, So when most people with adblockers get in and try to open that - it won't show, right? How would you get around that?
You can’t when they have adblockers
@@websquadron I thought as much...have to find another route. Thanks!
I just realized that each time i click on my hamburger menu of my pop up menu, my website page always automatically scroll to top of the page ? Any idea why ? Help will be much appreciated ? :)
Have you set it to open the pop up
@@websquadron hello, i did. I solved the issue by changing the overflow to hidden in the pop up setting. Cheers! Thank you, i really appreciate your response. :)
I'm working on a website which has tabs, sub tabs and sub sub tabs. One main tab of mine has 5 sub tabs, out of which each sub tab has an additional 5/8 sub sub tabs. Is a full width off canvas menu advisable in this case, or a mega menu? Sorry if it's a noob question. Just trying to learn.
Mega Menu would work well for desktop. But an off canvas on mobile would be better and you could use accordions so that it shows the other sub items in a more concise way
How to make the popup "push" the whole page over. Use case is a chat window. User can do whatever on popup and still see and do whatever on main site. Cheers.
Would need some hefty JS
Does having the menu like this (hidden) have an effect on SEO esp if used on desktop?
It will so the best solution is to add a proper nav menu and make it be hidden responsively
Interesting thank you. I just had a elementor designer on TH-cam say it’s fine as it’s in elementor’s DOM and not a browser pop up…
i have created popup following your steps as you guided but my popup is not showing when i click on icon what is the reason?
Have you got any JS optimisation applied?
I also facing the same problem. my menu popup opens after 4 to 5 continue clicking. I install a wp rocket. How can I fix this issue
If there are sub menus under each menu header on mobile, and the title wraps, they will NOT display centered.
Have you tried adding css?
Scrolling your video tutorials when stuck, it is always high level to solve my problems . Love and respect 💓 brother.
But according to one page layout when I use offcanvas popup menu, when click on link item , the pop don't go off untill I click outside or close button.
Any solution for that , once I click anywhere in popup link it take to the navigated section n popop close 👍
That will need some additional JS that I’ll need to check
السلام عليكم
Can ask you a question
Ok
is thereany possibiltyi can do this without elementor pro
Best to use the templates
hey man how can i add off-canvas to main menu one one menu menu item must off-canvas how can i add it
Hmmmmmmm not sure
The button is not working for me, any reason why? I have another website that I did this for and there were no issues, but for some reason I have all kinds of console errors with this site.
That may depends on your site, plugins, code snippets, or anything else.
@@websquadron Yeah I disabled the elementor plugin and there were no console errors. Not sure how to fix that at this point.
The close button isn't working on tablet and phone devices! How to fix that?
Is there a Z Index issue with it not being on the front?
@@websquadron No but i set the pop-up animation for the desktop version to default and after that i tried the animation on both tablet and phone devices and it worked just fine, It's weird but if it works it works
@@websquadron However i tried to set an entrance animation for an icon that open a menu for the phone but the problem is that the animation triggers not only the icon but even the drop-down menu! Is there a way to prevent that from happening and is there a way to set the duration for the animation to let's say 10sec?
Great 👍 but dud I need a help I have an video on my site and i m using ultimate memeber plugin.Now once I click on that video I want to play that but if user is login in else not.
Best to check with the plug-in developers as I don’t use that.
There is only one problem: When there is a submenu, it gives an error.
I don’t get that issue
You must mention in your thumbnail and title that it needs elementor pro😠
It should be obvious that I am as why would I not use EL Pro?