Skip to main content
All CollectionsLayout Manager Components
Image Comparison Slider Component
Image Comparison Slider Component
Sportsdigita Support avatar
Written by Sportsdigita Support
Updated this week

Note: This article and tutorial is utilizing our newest component version, contact your CSM with questions

The Image Comparison Slider component is a dynamic and engaging way to visually compare two images, enhancing the interactivity and visual appeal of your presentation. Whether you’re demonstrating changes, improvements, or simply contrasting two images, this component offers a sleek and intuitive user experience.

Step 1: Add the Image Comparison Slider Component

Open the Component Store: Begin by accessing the component store, search for the “Image Comparison Slider” component, and add it to your slide.

Step 2: Position & Size Component, Select Your Images

Position and size your Image Comparison Slide component on your slide.

Choose Image A and Image B: Utilize the component settings panel to select your two images. Navigate to the file library, and pick the images you want to compare.

Step 3: Customize the Image Comparison Slider

Adjust Image Order: Determine which image appears on the left (Image A) and which appears on the right (Image B) to best convey your comparison. Image Order can also be adjusted via the component settings panel

Set Divider Styling: Customize the appearance of the divider, such as its color and to ensure it aligns with your overall slide design.

Step 5: Preview and Save Your Changes

Make Final Adjustments: Fine-tune the image order, divider starting position, or styling if necessary.

Save Your Work: Once you’re satisfied with the setup, save your changes to make the component live on your presentation.

Did this answer your question?