Scenario 1

Merchandise Using a Single Image with Swatches

In this scenario you merchandise a product with multiple colors or sizes using a single image, make sure that none of your variation attributes are set as a slicing attribute.

SiteGenesis assumes that you do want to indicate to the customer that other colors or patterns are available for some products. If your storefront is based on SiteGenesis, and if you use the color attribute as a variation attribute, swatches are automatically used by the application. Otherwise, swatches are not available. However, if you want to change this behavior, you can customize your storefront templates.

In this scenario, you configure the T-shirt (TS) product to appear with a single image and several color swatches.

  1. Select site > Merchant Tools > Product and Catalogs > Products, find the base product you want to merchandise. To open the product, click the product ID. For this scenario, search for T-shirt. This product isn't part of SiteGenesis data and you must create it using the directions in Base Products for Scenarios.
  2. Click the Categories tab and click Edit Categories.
  3. Expand womens > womens-clothing, select womens-clothing-tops, and click Apply.
  4. On the Products page categories tab, make sure that none of the variations are assigned to a category. You can also select the variations from the Products list and edit them so they are not assigned to any categories.
  5. On the Product page Variations tab, for the color variation attribute, deselect slicing for all variation attributes. When you deselect slicing in this scenario, only one image is presented for all variations.

Storefront Experience

  1. The customer searches for keyword T-shirt.
  2. The storefront shows the search results page with one result for the product from the Women's Tops category. The result shows a navy shirt with three swatches beneath it.
  3. The shopper clicks T-shirt for the navy variation.
  4. The storefront shows the product detail page, and the navy image included for the base product appears.