The Repeat On function in Instant is a powerful tool that allows you to create and manage repeating sets of content elements. Instead of manually creating individual items, you can define a template once and automatically generate multiple instances based on your Shopify data.
Overview
The main idea behind Repeat On is to provide a flexible and scalable way to manage multiple instances of similar content without manually duplicating each one. Define a template for a single item, and the repeater generates as many items as needed—each following that template.
Common Use Cases
Use Case | Description |
Collection Products | Display products from a specific Shopify collection |
Related Products | Show products related to the current product |
Complementary Products | Display items that complement the current product |
Product Images | Repeat through all images tied to a product |
Requirements
Before using Repeat On, ensure the following:
Requirement | Description |
Shopify Connection | Your Instant project must be connected to your Shopify store |
Published Products | Products and collections must be created and published in Shopify |
Creating a Repeater
A repeater can be created based on a collection or a product. The following example demonstrates creating a product grid that fetches products from a specific collection.
Step 1: Insert a Column Element
Insert a Column element from the Elements panel and place it within your layout.
Step 2: Connect to a Collection
Select the inserted column
Click the plus icon (+) next to Shopify Content
Select Collection
Step 3: Choose Your Collection
Select the collection that contains the products you want to display.
Step 4: Add a Product Card
Insert a Product Card element from the Elements panel (or create your own custom card) and drag it into the column you inserted.
Step 5: Enable Repeat On
Click the plus icon (+) next to Repeat On
Set the Limit field to control how many items load into your layout
Limit Recommendations
Container Type | Recommended Limit |
Column Container | 4 items works well for grids |
Slider Element | Up to 20 items for dynamic product sliders |
Connecting Repeating Data
After setting up the repeater, connect each element within your product card to the appropriate Shopify data.
Connecting the Product Image
Select the image within the product card
Click on Image
Select the Shopify tab
Select the Featured image
Connecting the Product Title
Select the product title layer within the product card
Click the database icon next to Content
Select Title
Connecting the Product Price
Select the price layer within the product card
Click the database icon next to Content
Select Price
Tip: To learn more about which data is supported as a dynamic source, check out our article on Shopify Content.
Elements That Can Be Repeated
Element Type | Description |
Products in Collections | All products within a selected collection |
Related Products | Products marked as related in Shopify |
Complementary Products | Products marked as complementary in Shopify |
Product Images | All images associated with a product |
Quick Reference
Task | Action |
Insert container | Insert panel → Elements → Column |
Connect to collection | Select column → Plus icon (+) → Shopify Content → Collection |
Add product card | Insert panel → Elements → Product Card (or custom) |
Enable repeater | Plus icon (+) next to Repeat On |
Set item limit | Repeat On → Limit field |
Connect image | Select image → Dynamic → Featured Image |
Connect title | Select text → Database icon → Title |
Connect price | Select text → Database icon → Price |
Workflow Summary
Step | Action |
1 | Insert column element |
2 | Connect column to Shopify collection |
3 | Select target collection |
4 | Add product card to column |
5 | Enable Repeat On with limit |
6 | Connect image to Featured Image |
7 | Connect title to Title |
8 | Connect price to Price |