How to Add a Before and After Gallery to Wix
Wix lets you upload photos but not build a filterable before and after gallery. Here's how to add one without a developer, and what to watch for.
By the founder of Proova
Proova's founder has spent years building websites for plastic surgery practices and med spas.
You can put before and after photos on a Wix site in about five minutes. Making them useful to a patient who's deciding whether to book takes a little more thought.
This guide covers three ways to do it, how Wix handles embedded code (it's different from Squarespace or Webflow), and a short test to run before you send anyone to the page.
The short answer
To add a gallery tool to Wix, you use the Embed HTML element (Wix's name for an HTML iframe), paste the tool's code into it, size the box so the whole gallery shows, and publish. The one thing to know in advance: Wix puts that code inside its own frame, so the gallery lives in a box on your page.
Option 1: Two photos side by side
The simplest route is to upload a before photo and an after photo and place them next to each other with a caption.
It works. It's also the weakest option:
- There's no slider, so patients can't compare closely.
- There's no way to filter. A patient looking for facelift results scrolls past everything else first.
- On a phone, side-by-side layouts often shrink the photos until the details disappear.
If you only have a handful of cases, this gets you started. Don't stay here long.
Option 2: A slider widget or app
You can add a before and after slider from a widget provider. Some are apps from the Wix App Market. Others, like Elfsight's Wix guide, give you a code snippet to paste in.
A slider is a real step up. Patients can drag between before and after and see the change.
What a slider usually doesn't give you is the stuff around the photo. Patients can't narrow to people like them. There's no record of patient consent. And the tool wasn't built for patient photos, so ask where the files live and whether the company will sign a Business Associate Agreement before you upload anything.
Option 3: An embed-based gallery tool
A gallery tool made for aesthetic practices keeps your cases in its own dashboard and gives you a snippet to paste into your site. New cases show up on the page automatically.
This is the setup that lets a patient filter by procedure, age range, and gender. It's also the one where your front desk can add a case without opening Wix.
Proova works this way. Here's how to add it.
How to add the embed on Wix
- Get your embed code. Create a free Proova account and copy your snippet. It's one script tag.
- Open your page. In the Wix editor, go to your results or gallery page.
- Add the Embed HTML element. Click Add, choose Embed Code, then pick Embed HTML. In some Wix editors this is called an HTML iframe.
- Paste the code. Click Enter Code and paste your snippet.
- Size the box. Stretch the element to the full width of the page, and make it tall enough for the whole gallery.
- Publish and test. View the live page, not just the editor preview.
The one thing that's different about Wix
On most platforms, an embedded gallery becomes part of your page. Wix works differently. The Embed HTML element is a sandboxed frame, and Wix says the code inside it can't reach the other elements on your page. Wix's developer docs describe it the same way, as a separate environment that doesn't have direct access to the rest of the page.
Two things follow from that.
The box has a set size. If the content inside is taller than the box, Wix cuts it off and shows scroll bars. A gallery with a scroll bar inside a page that also scrolls is awkward on a phone. Give the box plenty of height, and check it on a real device.
Desktop and mobile can need different sizes. What fits on a laptop may cut off on a phone. Look at both views in the editor, then check the live page on your phone.
None of this is a dealbreaker. It just means you should test Wix more carefully than you would on other platforms.
A five-minute test before you go live
Open the published page on your own phone and go through this list:
- Can you see the whole gallery without scrolling inside the box?
- Does the slider respond to a swipe?
- Do the filters fit on the screen?
- Does the consultation button take you to your booking page?
- Is the page quick to load?
If the answer to any of these is no, fix it before you point patients to the page.
Plans and your domain
Wix's custom code tools have been tied to paid plans, and some features also need a connected domain. A practice with its own domain is almost certainly on a paid plan already, so this rarely gets in the way. If you're still on a free Wix plan, check Wix's current rules before you start.
Where your patient photos should live
Before and after photos of identifiable patients are health information. Putting them in your Wix media library puts them in the same place as your logo, and anything shown on a public page can be opened by anyone with the link.
You need written permission from each patient before a photo goes public. Our guide to getting patient consent for before and after photos walks through it. For storage, our post on where to store patient photos compares your options.
This isn't legal advice. A healthcare attorney can tell you what your state requires.
Frequently asked questions
Does Wix have a built-in before and after gallery? Wix has galleries for displaying photos, but a filterable before and after gallery with a comparison slider usually needs an app or an embedded tool.
Why does my embedded gallery get cut off? Wix shows embedded code inside a fixed-size frame. If the content is taller than the frame, it's cropped. Make the element taller, and check desktop and mobile separately.
Do I need a paid Wix plan? Often, yes. Check Wix's current requirements for the embed feature you plan to use.
Can patients filter by procedure on Wix? Not with a basic slider. A gallery tool built for aesthetic practices can, since it records the procedure, age range, and gender for every case.
Can I try it before I pay? Proova's free plan includes one published case, no credit card needed. You can see it on your own Wix site first.
On a different platform? See our guides for Squarespace and Webflow. Still comparing tools? Our guide to choosing before and after gallery software covers the questions to ask.
Your results deserve a gallery that shows them properly. If you're on Wix, you can start free and test it on your site today.
Ready to try proova?
Start free — 1 case, no credit card. Be live on your website in under an hour.
Start free — no card required