The Off Canvas widget lets you create hidden sidebar-style panels that slide in with customizable animations. Perfect for menus, templates, promotions, or extra content without leaving the page.
How to Use
- Drag and drop the Off Canvas widget.
- In General Settings, select the template or content to display.
- Choose horizontal (left/right) or vertical (top/bottom) position.
- Adjust width/height (custom or fit-content).
- Enable/disable page scrolling while the off-canvas is open.
- Configure the trigger button and off-canvas header.
- Style button, wrapper, header, and inner section via Styling Controls.
Content Settings
- General → Select template, Position (Horizontal: Left/Right, Vertical: Top/Bottom), Width (Custom/Fit-content), Height (Custom/Fit-content), Entrance animation, Toggle page scrolling.
- Button → Button title, Select icon, Icon position, Icon gap.
- Off Canvas Header → Title, Close icon, Position, Alignment.
Styling Controls
- Button → Typography, Text color, Hover color, Background color, Icon size, Icon color, Border, Radius, Padding, Margin, Box-shadow.
- Wrapper → Background color, Border, Radius, Padding, Box-shadow.
- Off Canvas
- Header → Background color, Border, Padding, Shadow, Typography, Text color, Icon color, Icon size, Icon gap.
- Inner Section → Background color, Padding.
Pro Tip
- Use different entrance animations (slide, fade, push) to match the page style.