I wanted to showcase hair transformations using Divi, so I grabbed some client before/after shots. First, I made sure everyone signed releases – didn’t wanna get sued, you know?
Setting Up The Gallery Structure
Opened Divi builder on a blank page, dragged in that gallery module. Split it into two sections: “Hair Horror Stories” and “Miracle Makeovers.” Pro tip: always label sections clearly so you don’t mix up Brittany’s frizz disaster with her final silky look later.
The Upload Struggle
Spent like two hours resizing photos ’cause Divi kept choking on large files. Had to:
- Crop all images to exact same ratio
- Run ’em through a compressor site
- Rename files as “ClientName_Before_01” so they’d sort properly
Almost threw my laptop when paired photos displayed sideways. Fixed it by checking “force same image dimensions” in Divi settings.
Making It Actually Look Good
Divi’s default gallery is boring, so I:
- Added mouseover effects showing hair stats like “color: level 7 ash”
- Used dividers between clients so Tony’s pixie cut wouldn’t bleed into Maria’s extensions
- Set up filters so visitors could sort by hair length or color changes
Big mistake: animated the “after” photos to fade in. Looked cool but made grandma visitors dizzy. Killed the animation next morning.
The Final Touches
Wrote honest captions like “Jenny came in with home bleach damage (left) – took 3 sessions to fix.” Added consultation buttons under each transformation because why not get leads?
What I Learned
Before/after galleries need serious prep work. Key takeaways:
- Natural lighting beats salon lights every time
- Shoot same angles or comparisons look fake
- Divi hates mismatched photo sizes – fight it early
Posted it yesterday and already got three bookings from the gallery. Worth the hassle!
