← All docs

Get started with FD Combined Listings

FD Combined Listings links separate products into a product group. On the product page, shoppers see the other products in the group as swatches and switch between them like variants. Each swatch links to that product's own page.

In your Shopify admin and theme editor, the app shows as FD Product Groups.

Install the app

Install FD Combined Listings from the Shopify App Store. The app opens on its home page, with a Setup Guide at the top.

The Free plan includes up to 10 groups. Starter ($4.95) and Pro ($19.95) allow more. See plans and limits.

Follow the setup guide

The Setup Guide has three steps. Each one is marked complete when the app detects it.

  1. Create your first product group. Click Create group. If you have no groups yet, you can click Auto-suggest groups instead. It finds products that share most of their title, like "Linen Shirt — Sand" and "Linen Shirt — Olive", and suggests them as groups. See bulk groups and automations.
  2. Add the theme block. Click Add theme block. The theme editor opens. Add the FD Product Groups block to your product template, then click Save in the theme editor. Back in the app, click Check status again if the step isn't marked complete.
  3. Enable app embed (optional). Click Enable app embed, turn on the embed in the theme editor, and save. You need it for swatches on product cards. If your theme doesn't support app blocks, this step is required instead of step 2: the guide shows "Your live theme does not support app blocks, so please enable the app embed instead."

Under the guide, App status shows On once you have a group and either the theme block or the app embed is on.

Create your first group

  1. Click Create group, or go to Product Groups > New Group.
  2. Under "What type of group do you want to create?", pick Single Option for a group like Color. Multi Option and Subcategory are covered in multi-option groups.
  3. Enter a Group Name. It's for internal use only.
  4. Enter the Option Name (e.g. color). Shoppers see it in the label above the swatches.
  5. Click Add products and pick the products to link.
  6. For each product, enter its Group Type Value, like Red or Navy.
  7. Under Appearance on Product Page, pick a style. See swatch styles.
  8. Click Save.

New groups are Active by default. Draft groups don't show on your store. If you are at your plan's group limit, a new group is saved as a draft until you upgrade.

The preview on the right shows the group as it will look. To see it on your store, click the eye icon (Preview on product page) on a product row.

Where swatches appear

Product pages. The group shows on the page of every product in it, where you placed the theme block.

Product cards. With the app embed on, groups can also show on product cards: collection pages, search results, the homepage and other pages with product grids. Product cards need a few more steps.

Turn on product card swatches

  1. Turn on the app embed (step 3 of the setup guide).
  2. Go to Settings. Under Show groups on product cards, click Create default placement if you don't have one. Check that Placement is enabled? is on.
  3. Open a group. In the Product Card Preview panel, turn the switch to Enabled.
  4. Under Appearance on Product Card, pick a style: Swatch: Color, Swatch: Image, Swatch: Circle Color or Dropdown/Select.
  5. Click Save.

Repeat steps 3 to 5 for each group you want on product cards. If swatches don't show on your cards, your theme may need a custom placement. See themes and placements.

Theme setup page

Theme setup in the app menu has two guides: How to Add Theme Block and How to Remove from Your Theme. Pick a theme, click Go to theme editor, and follow the steps with screenshots. To remove the app from a theme, click the trash can icon next to the FD Product Groups block.

Related

Install FD Combined Listings

Cart
Empty Cart
Apply