內容簡介
OffCanvas / Drawer 是一款靈活且輕量的 WordPress Gutenberg 區塊，讓使用者能夠創建從螢幕左、右、上或下滑入的抽屜、側邊菜單和彈出面板，非常適合用於行動裝置菜單、WooCommerce 購物車抽屜及公告等，無需撰寫任何程式碼。
【主要功能】
• 支援多種抽屜位置：左、右、上、下
• 內建觸發按鈕與短碼生成器
• 完整的樣式控制與自訂選項
• 支援 InnerBlocks，隨意添加區塊內容
• 高度可配置的動畫效果與過渡類型
• 針對行動裝置進行優化，完全響應式設計
外掛標籤
開發者團隊
② 後台搜尋「OffCanvas / Drawer – Responsive Slide-In Drawer & Popup System」→ 直接安裝（推薦）
原文外掛簡介
OffCanvas / Drawer is a flexible and lightweight WordPress Gutenberg block that lets you create slide-in drawers, off-canvas menus, and popup panels that open from the left, right, top, or bottom of the screen.
Perfect for mobile menus, WooCommerce cart drawers, newsletter popups, announcements, and custom sidebar content — all without writing a single line of code.
The block supports InnerBlocks, shortcode generation, complete styling controls, and advanced trigger options. It works with any WordPress theme, is fully responsive, and optimized for performance.
Use OffCanvas for:
Mobile off-canvas menus
WooCommerce cart & checkout drawers
Promotional and announcement popups
Contact forms & lead-generation panels
Help, support, and documentation sidebars
Newsletter signup panels
App-style bottom sheets
Slide-in alerts and notifications
Lightweight, SEO-friendly, and built for both beginners and professionals.
Free Features:
OffCanvas Drawer Settings
Drawer positions: Left, Right, Top, Bottom
Built-in trigger button
Shortcode generator with clipboard copy
Prevent body scroll when drawer is open
Backdrop overlay support
Trigger Button Customization:
Button alignment (Block-level control)
Typography controls
Text & icon support
Color settings
Margin & spacing
Shadow controls
Ripple effect animation on click
Close Button Customization:
Colors controls
Size settings
Shadow support
Custom close icon support
Close button position control
Popup & Panel Design:
Background: Solid, Gradient, Image
Header styling (title typography & colors)
Close icon styling
Popup header background control
Toggle popup header visibility
Popup header title position control
Content Support:
Full InnerBlocks support (add any Gutenberg block inside)
Use anywhere via shortcode
Advanced Design Controls
Backdrop color & opacity control
Popup animation & transition types:
Default
Slide
Fade
Push
Reveal
Zoom ✅ (New)
Flip ✅ (New)
Bounce ✅ (New)
Configurable animation duration (ms) ✅ (New)
Animation easing presets including: ✅ (New)
ease
ease-in
ease-out
ease-in-out
linear
Backdrop blur control support ✅ (New)
Direction control: Left, Right, Top, Bottom
Custom width & height
Button border, radius, padding & hover styles
Icon size, color, hover color & position
Pro Features
Smart Triggers & User Behavior:
Custom trigger selector (open with any external element)
Show or hide built-in trigger button
Toggle mode (same trigger opens & closes)
Close on outside click
Trigger frequency control
Delay trigger (open after X seconds)
Scroll depth trigger (open at X% scroll)
Scroll into view trigger
Inactivity trigger
Exit intent detection (desktop)
How to Use
Install and activate the OffCanvas Block plugin.
Open the Gutenberg editor.
Add the OffCanvas Block from the “Widgets” category.
Customize the trigger button, popup area, background, typography, and interactions.
Add any content using InnerBlocks.
Save and publish!
You can also use the generated shortcode to display the OffCanvas anywhere on your site.
