Our classic aluminum carry-on luggage, ready for take off.
Notes
Make sure all your components are up-to-date in the Assets panel on the left.
Instructions
1: CMS
In your Framer Commerce CMS collection, enable the "Image Variant IDs" field from Shopify.
2: Variant Selector Component
Connect the "Image IDs" variable to the "Image Variant IDs" CMS field.
Under the "Images" group, for "Type", select "Gallery".
Under the "Images" group, for "Two-Way", toggle on or off to allow clicking on the image to change the selected variant.
2: Slideshow component
You can copy and paste the Slideshow component from this file or insert from the plug in and connect the Image variables to your CMS.
The slideshow component behaves very similarily to the native Framer component, but with image props to connect to the CMS instead of component instances.
The circle pagination is controlled in the Slideshow component, but there are also arrows you can use and reference your own components (left/right, active/disabled) for complete control.
Built by Framer Commerce. © Copyright Buttery Supply Inc. 2025