The Media Gallery widget turns Media Gallery fields — or images/videos across items — into rich gallery layouts (grid, masonry, collage, slider, and more). Visitors can search and filter, open a lightbox, go to an item page, or checkout when payments are enabled.
The app binds data to this widget — not to native Harmony Image or gallery elements. Forms can upload into Media Gallery fields; Repeater and Dynamic Page can show gallery fields inline with Field formatting.
Use case examples
- Architecture portfolio — Masonry of project photos; click through to a Dynamic Page case study.
- Product lookbook — Filterable collage with lightbox and Buy now in the lightbox (Pro).
- Agency case studies — Slider of cover images with search by tag.
Configure a Media Gallery
Build with AI: Open AI setup at the top of the panel and describe layout and click behavior — then refine in Manual. Details: AI setup.
- Add Media Gallery from Add → Elements → Installed Apps → CMS for Harmony.
- Select the widget → open Settings.
- In Content, connect a data source and choose gallery or media fields.
- Optionally configure Search & filters, Data refresh, Dynamic page, Payments, Layout, Design, and Mobile.
- Publish the site.
Content
Where: Manual overview → Content drill row
Where: Settings → Content
- Set Data source to Wix CMS or External Database (see External databases).
- Choose gallery mode: a Gallery field on each item, or a Media field across items.
- Set Items to load, Max media, Sort by, and Sort order.
Search & filters
Where: Manual overview → Search, filters, & sort drill row
Where: Settings → Search & filters
Full reference: Search & filters.
Data refresh
Where: Settings → Data refresh
Full reference: Data refresh.
Dynamic page
Where: Manual overview — toggle Dynamic page, then open the row (Wix CMS only)
Where: Settings → Dynamic page (Wix CMS only)
- Set When image is clicked (lightbox, item page, or related action).
- Match Page path and Page link field when linking to a Dynamic Page.
- Set Video playback: modal, play on click, or muted autoplay (images still follow the click action you set).
Overview: Dynamic pages.
Payments
Where: Settings → Payments (Pro)
Show Add to cart / Buy now in the lightbox when the collection has catalog payments enabled.
Layout
Where: Settings → Layout
- Pick a Layout: grid, masonry, collage, slider, slideshow, strip, or column.
- Adjust Columns, Gap, Image aspect, Fit, and Corner radius.
- For slider-style layouts, set thumbnail placement, visible slides, and autoplay interval as needed.
Design
Where: Settings → Design
Set Background.
Mobile
Where: Settings → Mobile
- Set On small screens and optional Mobile columns.
- Set the Breakpoint (320–1200 px).