Shopify Development 
If you’re selling products with similar attributes like colors, styles, sizes, etc, you may want to combine them into a single listing for a cleaner product catalog. While Shopify already provides a combined listing app to help you do that, it’s only available for Shopify Plus. So, if you’re on standard plans, we’ll share with you an alternative method, using a Shopify app: NS Color Swatch Variant Images.
In this guide, you’ll discover:
- Step-by-step instructions to combine products on Shopify (with a video walkthrough)
- Pro tips and FAQs to help you avoid common setup issues
Let’s dive in and transform the way your products appear on Shopify!
STEP 1: Set Up NS Color Swatch Variant Images App to Enable Combined Listings
Set Up NS Color Swatch Variant Images
1. Install the app
Go to the Shopify App Store, search for NS Color Swatch Variant Images by NestScale, and click “Add app.” Installation is quick and comes with a free plan to get you started.
2. Launch and initialize
Open the app from your Shopify admin. You’ll see a “Get Started” guide right away.
3. Embed the app in your theme
Click Embed App. This will redirect you to Shopify’s theme editor, where you simply toggle the app ON and save changes.
Display Color Swatches on Your Storefront
1. Go to Option Configuration
On the app’s sidebar, click “Option Configuration.” Here, you’ll see your products.
2. Add products if missing
If your desired product doesn’t show up, click Add Product Options and find it manually.
3. Select products and variants
Choose the products you want to display as combined variants. You can select one or more products at once.
4. Enable Display Style on Product Page
Toggle ON “Display Style on Product Page” for the variant(s) you want to turn into swatches.
5. Enable on Collection Pages
There’s a second toggle for “Display on Collection Pages”—turn this on to show swatches right in your collections (great for color or style choices).
6. Choose your swatch type
Square, circle, or pill shapes, each with live preview.
Pick between displaying Shopify’s own variant images, uploading your own, or choosing a custom color/HEX code
7. Assign images or colors
Use Edit Swatch to match the right image, color, or label to each variant.
8. Save your changes
Click Done, then Save. Your swatches are now live on your storefront.
STEP 2: Customize Swatch Design of Your Combined Listings
1. Head to Design Settings
In the app menu, find “Design Settings.” Here, you can separately customize styles for product and collection pages.
2. Customize details
- General settings: adjust swatch size and spacing
- Image settings: set hover effects, show borders, or add labels
- Selected/unselected states: choose different colors or effects for active options
- Hover Tooltips/shadows: add helpful hints or highlight effects for better UX
3. Live preview
Use the built-in Preview Panel to see all changes before saving. This ensures your swatches match your store branding perfectly.
STEP 4: Combine Products into a Single Listing
1. Click Combined Listing
On the app sidebar, choose “Combined Listing.”
2. Create a Product Group
Hit “Create Product Group” and name your group (e.g., “Summer Tees” or “Decor Pillows”).
3. Select products to group
Add the individual products you want to appear under the same listing. You can merge items that were previously independent listings.
4. Save and enable display
Click Done, then Save. Enable display options for both product and collection pages.
5. Preview your storefront
Visit your site and see your grouped products as a single listing, with clickable swatches or images to switch between each variant.
Pro tip: Use this feature to cross-sell related items and boost your average order value. Shoppers are more likely to add multiple variants to their cart when they see all options together!
NS Color Swatch Variant Images doesn’t just offer combined listings. It’s packed with features designed to help Shopify merchants organize and present their products more effectively:
- Split variants into separate products: For when you want the opposite effect, showing options as standalone items
- Merge products as variants: Bring together items that were originally listed apart
- Assign custom images: Each variant can have its own, fully customizable image
- Quick view product details: Let shoppers preview info and images without leaving the collection page
- Multi-language labels: Perfect for stores with an international audience
Video Tutorial: How to Create Shopify Combined Listings
In this video, Sarah will guide you step by step through the process of combining multiple products into a single listing on Shopify, from initial setup to full customization.
You’ll also see how to connect separate products under one listing with clickable swatches, allowing customers to easily browse and switch between different options right on your storefront.
FAQs
What are the advantages of using Combined Listings on Shopify?
Using combined listings lets you group related products, such as different colors or styles into a single, organized product page. This simplifies catalog management, makes it easier for customers to browse all options, and can help boost conversions by displaying each variant with its own image, description, and media. With NS Color Swatch Variant Images, you can also create interactive swatches that let shoppers instantly preview every option, enhancing both the visual experience and the likelihood of a purchase.
How is a Combined Listing different from just using product variants in Shopify?
Traditional Shopify variants work within one product, but combined listings allow you to link completely separate products as selectable options under a single listing. This means each option can have its own dedicated images, unique URL, and detailed content. With NS Color Swatch Variant Images, you get even more control, showing each linked product as a clickable swatch or image, with smooth transitions and independent inventory tracking, all without the limitations of Shopify’s standard variant system.
Are there any theme or app compatibility considerations?
Yes, combined listings created with NS Color Swatch Variant Images work best on Shopify’s free themes (version 15.0.0 or newer) and most modern paid themes. If you use a highly customized theme or additional third-party apps, it’s always a good idea to test or reach out to NestScale’s support team for help.
