FrameWoo
Components / Product
P
woo-product-gallery

Product Gallery

Render the main product image gallery.

Setup steps

  1. Open the FramerWoo plugin and insert Product Gallery.
  2. Place this inside a product CMS context so it can read the current product automatically.
  3. Configure the component behavior in Framer's property panel.
  4. Style its default, responsive, loading, and empty states on canvas.
Product Gallery inserted on a Framer product card with its CMS image fields connected in the property panel
Insert Product Gallery inside the product CMS context, then connect Product ID and Images JSON.

Property panel

Use Framer's controls to connect context and match your visual system.

Context
Controls the WooCommerce or CMS data source used by the component.
Content
Controls visible labels, values, formatting, and empty-state copy.
Style
Controls typography, colors, spacing, alignment, and responsive behavior.
Framer property controls for the Product Gallery component
Product Gallery controls for CMS bindings, display modes, spacing, lightbox behavior, and visual styles.