ms3variants

With ms3variants installed, ms3OptionsColor adds dictionary colors to each catalog variant. The package does not create variants and does not change price, stock, or _variant_id. It adds colors to a prepared list.

Requirements

1. ms3variants is installed.
2. The listing has usePackages=ms3Variants.
3. Setting ms3optionscolor_variants_decorate is Yes.
4. The variant options include a key from ms3optionscolor_default_option_key (for example color) with an exact dictionary value match.

Turn off with ms3optionscolor_variants_decorate = No. Variants stay as in ms3variants, without swatches.

Listing call

fenom

{'!msProducts' | snippet : [
  'parents' => $_modx->resource.id,
  'usePackages' => 'ms3Variants',
  'tpl' => 'tpl.msProducts.row'
]}

modx

[[!msProducts?
  &parents=`[[*id]]`
  &usePackages=`ms3Variants`
  &tpl=`tpl.msProducts.row`
]]

After the plugins, the catalog row has variants, has_variants, variants_json. The package adds variants[].swatches for keys from the setting.

Row chunk markup

Loop variants in a Fenom chunk (pdoTools):

{if $has_variants?}
  {foreach $variants as $variant}
    {set $sw = $variant.swatches.color ?: []}
    <span data-ms3oc-swatch
          {if !$sw.color && !$sw.pattern}data-empty{/if}
          {if $sw.pattern}data-has-pattern{/if}
          style="{if $sw.color}background-color:#{$sw.color};{/if}{if $sw.pattern}background-image:url('{$sw.pattern}');{/if}"></span>
    {$variant.options_array.color}
  {/foreach}
{/if}

If the setting has several keys (color,material), read swatches.material and the other keys the same way.

One swatch entry:

Field	Description
color	HEX without #
pattern	Pattern URL
title	Label from the dictionary
value	Option value (present even without a dictionary match)

Without an exact option_key + value match, color / pattern / title stay empty.

Product colors without SKUs

If you do not need to walk variants, call the snippet in the same chunk:

fenom

{'!ms3OptionsColor' | snippet : [
  'product' => $id,
  'options' => 'color',
  'tpl' => 'tplMs3OptionsColor',
  'limit' => 6
]}

modx

[[!ms3OptionsColor?
  &product=`[[+id]]`
  &options=`color`
  &tpl=`tplMs3OptionsColor`
  &limit=`6`
]]

Cart

The options._variant_id branch in chunk tplMs3OptionsColorCart shows a color with no option change and a link to the product ?variant=ID. Variant changes and price belong to ms3variants. Frontend.

Common issues

Symptom	Check
No variants[].swatches	usePackages=ms3Variants, decorate setting = Yes
Empty swatches.color	Option value matches the dictionary literally
No variants at all	ms3variants and listing parameter
Zero-size swatch	ms3optionscolor_frontend_css

Events: Events. Flow: Flow I. Setting: System settings.