內容簡介
Twenty20 Image Before-After 是一款專業級的圖片比較工具，能夠以引人入勝的方式展示轉變，適合用於攝影作品集、房地產改造、設計變更等多種用途。
【主要功能】
• 響應式設計，適用於所有設備
• 水平和垂直滑動選項
• 可自訂滑動器位置和方向
• 自訂「之前」和「之後」標籤
• 可調整圖片寬度和對齊方式
• 支援多個滑動器於同一頁面
外掛標籤
開發者團隊
原文外掛簡介
Twenty20 is a professional-grade image comparison tool that helps you showcase transformations in a highly engaging way. Perfect for:
Photography portfolios
Real estate before/after
Renovation projects
Design makeovers
Product comparisons
Restoration work
Medical procedures
And much more!
Video Tutorial
Live Demo
Check the Live Demo.
Key Features
Responsive design – works perfectly on all devices
Horizontal and vertical sliding options
Customizable slider position and orientation
Custom “before” and “after” labels
Adjustable image widths and alignments
Mouse hover sliding effect
Touch-enabled for mobile devices
Multiple sliders per page
Widget support for sidebars
Native Gutenberg block with live preview and sidebar settings
SEO-friendly with proper alt tag support
Accessibility compliant image comparisons
Page Builder Support
Block Editor (Gutenberg) — native Twenty20 Before-After block with live preview
Elementor
WPBakery Page Builder (Visual Composer)
Flatsome UX Builder
Classic Editor
Perfect For
Photography before/after edits
Home renovation comparisons
Web design makeovers
Product transformations
Restoration projects
Beauty transformations
Real estate renovations
Usage
Shortcode Example
Quick Example
[twenty20 img1="" img2="" direction="vertical" offset="0.5" align="right" width="60%" before="Before" after="After" hover="true"]
Shortcode Parameters
img1 – image ID.
img2 – image ID.
offset – range from 0.1 to 1.0.
direction – horizontal|vertical.
align – none|right|left.
width – supports both px and %.
before – text for the “before” label.
after – text for the “after” label.
hover – true or false.
