=== SlideDiff - Easy Before/After Image Slider ===
Contributors: sattivedevlabs
Tags: before after slider, image comparison, image slider, before and after, comparison
Requires at least: 5.8
Tested up to: 6.9
Requires PHP: 7.4
Stable tag: 1.0.0
License: GPLv2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html

Help your visitors see the transformation. SlideDiff provides a high-performance, touch-enabled slider to compare two images side-by-side.

== Description ==

Help your visitors see the transformation with **SlideDiff**. 

Built with UI/UX, SEO, and site speed in mind, SlideDiff provides a lightweight, high-performance slider to compare two images side-by-side. Whether you are a photographer showcasing edits, a contractor showing home renovations, or a designer displaying website redesigns, SlideDiff makes visual storytelling interactive and engaging.

Unlike other slider plugins that bloat your site with heavy external libraries, SlideDiff uses clean, modern CSS and vanilla JavaScript to ensure zero layout shifts and lightning-fast load times. 

**Key Features:**
* **Orientation Control:** Choose between Horizontal (left/right) or Vertical (up/down) sliding.
* **Touch & Mobile Optimized:** Fluid swiping on phones and tablets.
* **Move on Hover:** Optionally allow users to interact with the slider just by moving their mouse, no clicking required.
* **Performance First:** Built-in lazy loading and the ability to select the exact WordPress image resolution (Thumbnail, Medium, Large, Full) to save bandwidth.
* **SEO Friendly:** Custom Alt Text overrides for both the 'Before' and 'After' images.
* **Deep Customization:** Fully customize the handle style (Arrows, Circle, Standard), handle color, label text, and label background colors to match your theme perfectly.
* **Shortcode Generator:** Easily copy and paste the `[slidediff]` shortcode anywhere on your site, compatible with Gutenberg, Elementor, and all major page builders.

Brought to you by [Sattive Dev Labs](https://www.sattivedevlabs.com).

== Installation ==

1. Upload the `slidediff-easy-before-after-image-slider` folder to the `/wp-content/plugins/` directory, or install the plugin through the WordPress plugins screen directly.
2. Activate the plugin through the 'Plugins' screen in WordPress.
3. Navigate to the new **SlideDiff** menu in your WordPress admin dashboard.
4. Click **Add New Slider** to upload your Before and After images and configure your colors and settings.
5. Click **Save Slider Settings**.
6. Copy the generated shortcode (e.g., `[slidediff id="123"]`) and paste it into any post, page, or widget.

== Frequently Asked Questions ==

= Does this work on mobile devices? =
Yes! SlideDiff is built with native touch-action support, meaning users can seamlessly swipe the handle on smartphones and tablets.

= Will this slow down my website? =
No. SlideDiff was built specifically to be lightweight. It uses pure CSS for clipping masks and vanilla JavaScript (no jQuery dependency) for interactions. It also includes native lazy-loading toggles and image resolution controls to keep your page sizes small.

= Can I change the colors to match my brand? =
Absolutely. The custom configuration panel allows you to use a color picker to change the handle bar, arrows, label backgrounds, and label text to fit your exact brand guidelines.

= Does it work with Elementor or Gutenberg? =
Yes. SlideDiff generates a standard WordPress shortcode that can be pasted into a Gutenberg Shortcode block, an Elementor Shortcode widget, or any other page builder.

== Screenshots ==

1. The SlideDiff configuration dashboard with custom design and UI settings.
2. A beautiful horizontal before and after slider on the frontend.
3. A vertical before and after slider on the frontend.
4. The SlideDiff slider list table with quick-copy shortcodes.

== Changelog ==

= 1.0.0 =
* Initial Release. Features include horizontal/vertical orientations, custom handle styles, lazy loading, and touch optimization.
