Go to athemes.com

ProOffcanvas

See this widget in action here.

The Offcanvas Content Widget is a versatile tool to display content in an offcanvas panel, which can slide in from any direction. It supports dynamic content, templates, and sidebars, offering a flexible solution for creating engaging user interfaces.

Activate the Widget

This widget is part of the aThemes Addons for Elementor plugin. To activate it:

  1. Navigate to the aThemes Addons dashboard in your WordPress admin area.
  2. Search for the Offcanvas Content widget.
  3. Toggle the switch to activate it. The widget will now be available in the Elementor interface.

Widget Options

Offcanvas Content

  • Content Type: Choose between Custom Content, Elementor Template, or Sidebar.
  • Title: Add a title for the offcanvas content (only for Custom Content).
  • Content: Add WYSIWYG content (only for Custom Content).
  • Template: Select a saved Elementor template (only for Template option).
  • Sidebar: Choose a registered WordPress sidebar to display (only for Sidebar option).

Offcanvas Settings

  • Offcanvas Name: Set a unique identifier for this offcanvas area.
  • Direction: Choose the direction for the panel (Left, Right, Top, Bottom).
  • Trigger: Define how the offcanvas content is triggered:
    • Dynamic Tag: Use a dynamic tag as the trigger.
    • Class: Add a class to the trigger element.
    • ID: Add an ID to the trigger element.
  • Size: Adjust the width or height of the offcanvas area using px or %.

Style

  • Background Color: Set the background color of the offcanvas panel.
  • Title Color: Adjust the color of the title text.
  • Title Typography: Customize the font style, size, and weight of the title.
  • Text Color: Set the color for the main text in the panel.
  • Text Typography: Customize the font style for the main text.
  • Overlay Color: Define the color of the overlay that appears behind the offcanvas panel.

Conclusion

The Offcanvas Content Widget provides a sleek and modern way to display additional content. It’s ideal for menus, hidden features, or supplemental information. With its customizable design and flexible options, it integrates seamlessly into any website.