Setting Up Swatches with the SA Variants Combined App
Click here to watch the video:
Setting Up Swatches with the SA Variants: Combined Listings App on Shopify
1. Install and Enable the App
Go to the Shopify App Store and search for “SA Variants: Combined Listings.”
Install the app and access it from your Shopify admin dashboard.
2. Split Product Variants for Swatch Display
The app allows you to split product variants so that each variant (such as a color or style) is displayed as its own product on collection pages.
Each split variant can have a unique product title, images, description, and URL, improving both SEO and customer navigation.
On collection pages, these variants appear as color swatches or image swatches, making it easy for customers to visually compare and select options.
3. Configure Swatch Appearance
Within the app, you can set how variants are presented as swatches—either as color blocks or images.
Adjust the display settings to ensure swatches appear on product and collection pages as desired.
The app supports rich product listings for each variant, so you can further customize how each swatch links to its specific variant page.
4. Save and Test
After configuring, save your settings and preview your store to ensure swatches display correctly on both collection and product pages.
Setting Up Swatch Groups (Combined Listings) with SA Variants
1. Create Product Groups (Combined Listings)
In the SA Variants app, use the "product groups" or "combined listings" feature to link related products or variants together.
This allows you to group separate products (for example, different colors or styles of the same item) so they appear as swatches on each other’s product pages.
2. Assign Products to Groups
Select the products you want to group together.
Assign them to a combined listing group within the app’s dashboard.
These grouped products will now display as swatches, letting customers switch between them directly from the product page.
3. Customize Swatch Group Display
Choose how the grouped products’ swatches should appear (color, image, or button).
Adjust layout and style to match your store’s theme.
Each swatch in the group will link to its respective product page, providing a seamless navigation experience for shoppers.
4. Save and Review
Save your group settings and review the product pages to confirm that swatch groups are displaying and functioning as intended.
Summary Table: Swatches vs. Swatch Groups in SA Variants
Applies to
Variants within a single product
Multiple related products
Use case
Display variants as individual swatches
Link separate products as swatches
Setup location
Variant split configuration
Product groups/combined listings section
Display
Swatches for each variant on collection/product
Swatches for grouped products on product pages
SA Variants: Combined Listings enhances your Shopify store by allowing you to split variants for better visibility and group related products as swatches, improving both the shopping experience and store organization.
⁂
Last updated