Image Split – Before/After Image Comparison Slider

Image Split is a friendly, lightweight way to show before and after photos, product comparisons, or makeovers — all with a smooth draggable slider visitors can move with a mouse, touch, or keyboard.

Unlike clunky embeds or heavy page builders, Image Split:

🧩 Fits your workflow — Drop in a block (in posts or under Appearance → Widgets), or paste a shortcode. 🎨 Looks polished — Horizontal or vertical layout, ruler styles (line, bar, circle), and labels you can style to match your brand. ♿ Stays accessible — Keyboard navigation and ARIA support so more people can use your comparisons. ⚙️ Saves time — Set global defaults under Settings → Image Split so new comparisons start with your look.

Need product pages or Elementor? Premium adds WooCommerce and Elementor, plus deeper per-item customization.

Image Split official website | Plugin documentation

✨ Free features ✨

• Gutenberg block — Pick Before and After images, tune the ruler, and place labels without leaving the editor.
• Shortcode — Use [image_split] anywhere shortcodes run, with optional attributes for layout and styling.
• Widget areas — Add the same Image Split block under Appearance → Widgets (block-based widget editor).
• Orientation — Horizontal or vertical comparison.
• Ruler styles — Line, bar, or circle; custom color and width.
• Labels — Before/After text with position, color, background, and font size.
• Global defaults — Settings → Image Split for site-wide starting values.
• Responsive & touch-friendly — Works on phones and tablets.
• Lazy-loading friendly — Plays nicely with common lazy-load setups.
• Accessibility — Keyboard and ARIA support.

⚜️ Premium features ⚜️

• WooCommerce — Enable Image Split per product on the single product page, using gallery images or custom attachment IDs.
• Elementor widget — Drop Image Split into Elementor-built layouts.