Before/After Photo Comparison Section
Learn how to display before and after photos of medical or beauty procedures, organized by category and angle.
Before/After Photo Comparison Section
A business-only section for organizing and displaying before/after photos of medical or beauty procedures by category and angle.
What Is the Before/After Photo Comparison Section?
- Case-based management: Register a category, label, and before/after photos for each case
- Angle-based comparison: Register before/after photos separately for front, 45-degree, and 90-degree angles
- Category filter: Filter tabs are automatically generated at the top of the viewer based on the category values you enter
Setting It Up
Configure in the Editor
- Add the Before/After Photo Comparison section from the left panel of the edit screen
- Enter the top icon/title (eyebrow and headline)
- Use the Add button to create a procedure case
- Configure the following for each case:
| Setting | Description |
|---|---|
| Category | e.g. eye, nose, lifting — cases with the same value are grouped under one tab in the viewer |
| Procedure label | e.g. "Rhinoplasty + Tip Refinement" |
| Before/after by angle | Register Before/After images separately for front, 45°, and 90° angles |
Category Filter
The category values entered for each case are automatically turned into filter tabs at the top of the viewer.
- Frequently used categories are suggested via autocomplete as you type (eye/nose/contour/skin)
- You can also enter other custom values (e.g. "lifting", "orthodontics")
- If the category is left blank, the case will only appear under the "All" tab
Using the same category value across multiple cases lets visitors filter and browse only the procedure cases they're interested in via the filter tabs.
Before/After Images by Angle
Each case can include up to 3 angles: front, 45-degree, and 90-degree.
- Click the Add Angle button and select an angle
- Upload a Before (pre-procedure) and After (post-procedure) image for each
- Angles you don't need can be deleted
Registering multiple angles lets visitors see the before/after change from different viewpoints, which increases credibility.
Be careful not to use images that differ from the actual procedure results. Please check relevant medical advertising regulations before registering before/after photos.
Need Help?
If you have any questions about setting up the Before/After Photo Comparison section, please reach out via Contact Support!