Off Canvas Widget for Elementor

Off-canvas widget or fly-out content panel is a sleek style for showcasing content on websites these days. With the off-canvas widget, you can create a fly-out content panel easily using Elementor.

Create Off-canvas Widget Panel for your Content

The off-canvas widget provides you an option to add unlimited content blocks using Elementor repeater elements. Each block can contain a combination of title, text, video, images or you can even use a shortcode. Want to display a map in the off-canvas panel? That’s possible as well.

View Demo

Frequently Asked Questions

How often should I change my oil filter?

The oil filter cleans dirt and particles from
the oil that may cause damage.

How often should I change my oil filter?

Click edit button to change this text. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo.

How often should I change my windshield wiper blades?

Click edit button to change this text. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo.

AHow often should I change the vehicle’s oil?

Click edit button to change this text. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo.

How often should I clean my car?

Click edit button to change this text. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo.

How often should I replace the fuel filter?

Click edit button to change this text. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo.

Get Creative with Content Templates

Want to get even more creative? You can create a section or template with Elementor and load it in the off-canvas widget panel. This can be used to create complex content panels where you need complete control over every element’s styling and layout.

You can display contact forms, testimonials, social icons, showcase reviews, promotional banners, etc.

View Demo

You can contact with Us

Please send your message below. We will get back to your at the earliest!

[email protected]
1-800-123-4567

108 Thomaston Road, Preston
CT 06316, Delware

Facebook · Twitter · Instagram

Stunning Off-Canvas Menus with Off-Canvas Widget

Another great use case of saved content templates is to create a stunning off-canvas menu. You can set it to display only on mobile devices or all devices, however, you like it. Off-canvas menus can be good for a minimal design or providing a better experience on mobile devices.

View Demo

Display Flyouts from any Side of the Page

The off-canvas widget lets you designate the side where the panel should appear. The flyout panels can be placed on all four sides of
the browser window: Left, Right, Top, or Bottom. You can display
off-canvas content from any side, depending on the page design.

View Demo

Social Media

Address

108 Thomaston Road, Preston CT 06316, Delware

Contact Us

[email protected]
1-800-1234-5678

Elementor Off-Canvas Widget Features

Typography & Styling Options

Typography & color options available with the widget allow you to alter fonts, background color, and other elements’ color in just a few clicks.

Responsive Designs

Elementor off-canvas widget is built with responsive design approach. So, you can create a seamless experience for all kinds of device sizes.

Content Display & Positioning

Designate the position of the off-canvas panel depending on the page design and layout.

Promotional & Sale Banner In Stylish Flyout

Running an exciting offer on your products? Get more eye on your special offer by displaying them in a stylish fly out panels.

View Demo

Special
Dishes

Save
30% Off

Trigger Off-Canvas Widget from any Element

You can display a button or icon to trigger/open the off-canvas panel widget. If you want to use any other element or elementor widget on the page then you can do that as well with Custom Class and ID trigger options. PowerPack off-canvas widget is built with great flexibility and a developer-oriented approach.

Button

Trigger Off-Canvas panel with button toggle option

Icon

Trigger Off-Canvas panel with icon toggle option

Code

Trigger Off-Canvas panel with code using custom id or class toggle option

Off-Canvas Flyout Directions & Animations

Off-canvas widget panel comes with multiple direction and animation options.
So, you can create creative and engagine off-canvas panels on your site.

Slide

Reveal

Push

Slide Along

Looking for Some ideas to use Elementor Off-canvas Widget?

Now that we know what all functionality off-canvas widget offers, here are some examples
that you can use as inspiration for your next Elementor website.

Contact Us

Reach Us

Lorem Ipsum is simply dummy text of the printing and typesetting industry.

CONTACT
[email protected]
1-800-123-4567

ADDRESS
108 Thomaston Road, Preston
CT 06316, Delware

We’d love to hear from you!

CHICAGO

LOS ANGLES

FRANCE

HEAD OFFICE
108 Thomaston Road, Preston
CT 06316, Delware

The best delicious food in the town

Food quality is the quality characteristics of food that is acceptable to consumers. This includes external factors as appearance (size, shape, colour, gloss, and consistency) texture

GET OFFER

MOODY FOOD

Sometimes the perfect cure for a hard-hitting bad mood is something delicious.

Read your favorite e-books

How to make profitable Google ads Campaigns

Join 150,000+ follow readers. Get free and discounted bestsellers straight to your inbox with the ManyBooks e-Book deals newsletter.

Get Free Now

Signup for FREE Download E-Book

Get started for free.
No Spam or affiliate links.

Frequently Asked Questions

Here are answers to some common questions for the off-canvas widget.
If you have any more questions, please feel free to contact us.

Can I Create a Full-width or Full-screen Content Panel?

Yes, you can. Off-canvas panel's content width can be set either in pixels or percentage. You can also change this width based on the device size. So, for e.g. on desktop you can have a 450px wide panel and on mobile the same panel can be changed to 100% width. It's easy!

Can I add Custom Content to Off-canvas widget?

Yes, you can. Off-canvas widget uses Elementor Repeater fields. So, you can add as many content blocks as you want. It is easy to use and style.

Can I Display Images and Videos?

Yes, you can display images and videos in the off-canvas widget.

Can I show Dynamic Content like Recent Posts?

Off-canvas widget offers an option to display "Saved Templates". So, yes, you can use this feature to display dynamic content like recent posts. Create a saved section for Recent posts and display it inside the off-canvas widget.

Is Off-canvas Widget Responsive?

Yes, off-canvas widget is completely mobile responsive.

Can I use Background Image for Off-canvas Panel?

Yes, you can. Off-canvas widget has option for background color, gradient, and image.

Can I Change Toggle Button Syle?

Yes, you can change and customize the button style with available options.

Is it Possible to Enable Off-Canvas Panel from any Element?

Yes, off-canvas widget can be enabled or triggered from any element. You can check our documentation for step-by-step guide.

Do you have any Documentation for the Widget?

Yes, we provide extensive documentation for all the widgets. Click here for documentation for off-canvas widget.

Do you have any Video Guide?Accordion Title

Yes, we have added the Video Guide in the first section of this page. 🙂

Can I display a Contact Form?

Yes, you can. Simply add the form shortcode in the content box and that's it.

Will it work with Elementor Free Version?

Yes, PowerPack works with Elementor Free version. So, all the widgets will work with Elementor Free Version as well.

Join 50,000+ PowerPack Users

If you have an issue within 14 days which we can’t solve via support,
you’re more than welcome to a full refund!

Starter

Single Site

$49 $39

20% OFF

Take Elementor to next level with 70+ Essential Elementor Widgets and more.

WooCommerce Widgets
Cross Domain Copy Paste

70+ Elementor Widgets
100+ Section & Page Templates
Header Footer Builder
Advanced Display Conditions
White Label PowerPack
Use on Single Site
1 Year Support
1 Year Updates
30% Renewal Discount

Professional

Unlimited Sites

$129 $89

30% OFF

A complete package to grow your business with powerful features.

WooCommerce Widgets
Cross Domain Copy Paste
70+ Elementor Widgets
100+ Section & Page Templates
Header Footer Builder
Advanced Display Conditions
White Label PowerPack
Use on Unlimited Sites
1 Year Support
1 Year Updates
30% Renewal Discount

Lifetime

Unlimited Sites

$499 $209

BEST DEAL 40% OFF

Pay once and enjoy the all the features and updates for the lifetime.

WooCommerce Widgets
Cross Domain Copy Paste
70+ Elementor Widgets
100+ Section & Page Templates
Header Footer Builder
White Label PowerPack
Advanced Display Conditions
Use on Unlimited Sites
Lifetime Support
Lifetime Updates
One Time Payment