Elementor BETA 3.22 First Look - Off Canvas Widget!

Ooooh - the Off Canvas Widget just landed!
The Elementor BETA 3.22 is here (do not use on Live Sites yet): github.com/org...
Elementor Hosting - managed wordpress hosting :
be.elementor.c...
Elementor Pro - The builder that will make you a pro
be.elementor.c...
Grab our Course and $1 Business Packs: learn.websquad...
Book your 1-2-1 Consultation: learn.websquad...
We love to create - share - respond - and deliver.
Join our Facebook Group: / 3309523509284305
Get Code Snippets Pro: r.freemius.com...

[@louiswolmarans4759]

Off-Canvas is also better SEO since the content is rendered in the DOM on page load, where the Pop Up only fetches the markup when it's triggered.

[@phkoon]

That's what I was going to ask. Thanks!

[@johanstam3602]

@@phkoon yep, and that should be part of this vid. For the rest it's just a popup.

[@daveden2]

Nicely explained! 🙌 I love that Elementor keeps working on performance improvements as well

[@websquadron]

Notice how excited I got about the Child being set to 100% by default now :)

[@daveden2]

@@websquadron yeah!!! I was just complaining about it and it's already sorted 😆

[@harshilvora8]

Thank you for being so prompt with every elementor update - beta or not - making it easy for us to understand what to expect! Super valuable!

[@websquadron]

My pleasure!

[@SpencerTaylorOnline]

Finally, off-canvas is here! They should have the option to include a close button or icon in the widget itself, but you can't have everything.

[@websquadron]

Yup, I hope they see what I did and add it in.

[@ElementoryMyDearWatson]

Two really great and much needed updates, the container default now at full width... YES!! Many thanks for the demo Imran, very much appreciated.

[@websquadron]

My pleasure!

[@zafit02]

im glad although elementor still lacks some features to be a more professional tool, and i long for it with all my heart, like a css manager, i am happy to keep using it. it is the one i enjoy the most for making web pages. the offcanvas was very necessary for creating menus without popups. good news.

[@pezreloaded8436]

Thanks for keeping us updated on latest E updates, always helpful!

[@nmdk-design]

Thanks for this video! I like your entertainer approaches.

[@Dhrubo_Jyoti]

Thanks for the quick Update. Keep it up

[@websquadron]

Always!

[@QuaverloveStudio]

Great addition, the off-canvas widget.

[@pro-saqib]

I think it was there before! (Tempelates section while adding a new templelate)

[@bobbypalmer2460]

Thanks Imran

[@anzepockaj7675]

Finally!🙌

[@maddy1mymk]

Wow

[@zoltankemenes1981]

I like your content very much. Why do you keep using Elementor instead (or alongside of) of Bricks for example? I haven't seen any new Bricks videos from you in a while.

[@websquadron]

Range of clients have been using EL more plus there’s lots to cover

[@users9896]

I hope the elementor team can adjust the elementor backend to work faster like new Divi 5

[@johnwellington269]

hi how to use off canvas to make bottom right corner clickable icon for support icon? to show elementor form to leave msg

[@bennysh]

So basically it's like a popup but with just one widget. Seems nice.

[@websquadron]

Yup, exactly that.

[@y9gq37]

Does this solve the SEO issue when using popups for mobile navigation?

[@websquadron]

You’ll need to still add a menu into the header and hide it

[@phkoon]

@@websquadron damn

[@websquadron]

Yup :) See this: kzbin.info/www/bejne/rXTCeIigqa1nbdEfeature=shared

[@phkoon]

@@websquadron I'll do, thanks

[@colourberry]

For me it looks to be working fine in the editor page but as soon as I preview or publish and view in a fresh page, the off-canvas appears at the bottom of the page full width.

[@websquadron]

Could be a glitch there, as I had that once, and then it worked normally. Note that it's still BETA so hopefully it'll all be ironed out when the live appears.

[@colourberry]

@@websquadron Hi Imran, can I ask what Theme you are using? I'm using Astra. I wondered if there could be a conflict there and perhaps I should try the Twenty Twenty-Three Theme.

[@ened42]

Could this be used for moving filtering off canvas? I’m yet to find a good solution for this so far and that’s still one of my biggest challenges with filtering on mobile as I can only get them to appear above all my products so you have to scroll a bit past the filters first to get to the products.

[@websquadron]

Not tried that yet, but possibly. It'd need to be tested.

[@daedaluxe]

There's no close button?

[@websquadron]

Nope. But you can add an Icon, Button or Text to close it.

[@noelawill]

I use a site wide pop up for the mobile menu, what would be the main advantages for switching to off canvas over the pop up? I'm just wondering if it's worth all the extra work to make the change.

[@websquadron]

SEO as it's not visible in the Pop-Up, thus you need to add another Menu to your Page and hide it. With Off Canvas it'll be there... I think... Yes, I'm sure...

[@noelawill]

​@@websquadronthank you 😊

[@websquadron]

See this: kzbin.info/www/bejne/rXTCeIigqa1nbdEfeature=shared

[@ongleax98]

Hi, I love your tutorials. I have a problem with off-canvas though. When I go to insert the link to trigger the opening of the element, elementor can't seem to find the widget.

[@websquadron]

Have you refreshed the page?

[@ongleax98]

@@websquadron first of all, thank you for taking the time to answer. Turns out I just misunderstood the instructions. I just needed to listen to the video more carefully to find out what the problem was. Sorry for wasting your time.

[@websquadron]

@@ongleax98 You didn't waste anyone's time :)

[@PedroMPerpetuo]

@@ongleax98 Stuck in the same situation - what was it?

[@ongleax98]

@@PedroMPerpetuo basically, my error was treating this widget as a template. So I created the offcanva in a separate page and tries inserting it where i needed. But actually you have to either create it in the editor of the same page where you want it to show up, or create it in the header editor from the theme builder.

[@dansk9963]

Is there a limit to how many off canvases you can add to a page? And is it possible to have more than one trigger on a page for the same off canvas? Thanks!

[@websquadron]

Can add many :)

[@websquadron]

And yes you can trigger the same off canvas multiple ways on the same page

[@dansk9963]

@@websquadron What happens to the things do create with the beta version? I mean, when the real update releases. Is everything saved or do you have to create it all over?

[@websquadron]

@@dansk9963 They'll remain but i advise caution when using Beta on Live sites

[@dansk9963]

I will wait then. Is it possible to prevent multiple off canvases like it is with multiple popups?

[@tho8281]

Could you explain, why to choose canvas over popup?

[@websquadron]

You don’t need to create a separate template

[@websquadron]

See this: kzbin.info/www/bejne/rXTCeIigqa1nbdEfeature=shared

[@aurematic]

What is the point of the offcanvas when you have the popup that does the same? Right?

[@websquadron]

Less DOM

[@websquadron]

See this: kzbin.info/www/bejne/rXTCeIigqa1nbdEfeature=shared

[@meisterleise]

Damn, I've activated all Features in Beta 3.22 but the "off canvas" is not shown. How did you get it run?

[@websquadron]

Have you got 3.22 Free and Pro, and not just Pro?

[@meisterleise]

@@websquadron Oh crap! You're right. I simply updated everthing in the updater, but it didn't update the pro (I get the impression that happens very often). Now it's available - and meanwhile it has received an icon as well! Sorry for confusion and thank you! 😁

[@derleuchtturmwarter5866]

Does it make sense to use the off-canvas widget for the main menu, e.g. as a mega menu or for the mobile view?

[@daveden2]

From the Elementor ad banner, I believe that's the idea.

[@websquadron]

See this: kzbin.info/www/bejne/rXTCeIigqa1nbdEfeature=shared

[@derleuchtturmwarter5866]

@@websquadron Great! Thank you for the explanation!

[@user-lo7ke5zh3b]

can it be used in the Elementor Free version?

[@websquadron]

You’ll need pro for the nested elements

[@ThatGuyBarrold]

Is there any benefit compared to the popup version?

[@websquadron]

Leas templates and easier to build for some

[@websquadron]

See this: kzbin.info/www/bejne/rXTCeIigqa1nbdEfeature=shared

[@ThatGuyBarrold]

​@websquadron Hero! Kudos for smashing out the response video so quickly too 🙌. In other news, I've just introduced my cousin to your channel and he could only focus on your 3 monitor/frames in the background (they're pretty swish) 😆 I don't suppose you have a setup video for that I can send him?

[@websquadron]

@@ThatGuyBarrold Ha :) They’re led windows that pull back images based on an account. Quite pricey!! atmoph.com/en/products/aw102

[@ThatGuyBarrold]

​@websquadron well worth the money by the looks of it 👌

[@williamcooper8559]

noop, dont get why the off canvas is useful.

[@websquadron]

Could replace using Pop Ups for the Mobile Menu.

[@harshilvora8]

Any insights on what would be the advantage of replacing popups with an offcanvas widget ​@@websquadron? Just trying to understand how and why it might make more sense to use this over pop-ups for things like a site menu or even a product filtering menu on an e-commerce site.

[@websquadron]

See this: kzbin.info/www/bejne/rXTCeIigqa1nbdEfeature=shared