[P] Before/After
This section helps your customers compare two products easily (such as the difference between two materials) or visualize your products' benefits. Here are some real-life use cases of this section:
- Comparing different materials from bags or clothes
- Visualizing the effect on the skin for a cosmetic
Adding the section
To add this section, open the theme editor, click Add section, and select the Before/after section.
Supported blocks
This section has two block types. You can add up to two blocks:
- Before block: this block represents the "before" image, along with the image and content.
- After block: this block represents the "before" image, along with the image and content.
Section guidelines
Do
- Use images of similar dimensions for the before and after images.
- Upload sufficiently large images (we recommend images at least 2000px wide).
- Limit the amount of text (images can become short on mobile).
- Compare similar products or features.
Don't
- Don't use images whose content can't be easily compared visually.
- Don't use images with too busy backgrounds if you use text; it might make content hard to read.