Skip to content
  1. Компоненты
  2. ms3OptionsColor
  3. Витрина
  4. ms3variants

ms3variants

Если установлен ms3variants, ms3OptionsColor может дописать к каждому варианту в каталоге цвет из словаря. Пакет не создаёт варианты и не меняет цену, остаток или _variant_id. Он только обогащает уже готовый список.

Что нужно

  1. Установлен ms3variants.
  2. В листинге задано usePackages=ms3Variants.
  3. Настройка ms3optionscolor_variants_decorate = Да.
  4. У варианта в options есть ключ из ms3optionscolor_default_option_key (например color) с точным совпадением значения со словарём.

Отключить: ms3optionscolor_variants_decorate = Нет. Тогда варианты остаются как у ms3variants, без swatches.

Вызов листинга

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

После плагинов в строке каталога будут variants, has_variants, variants_json. OptionsColor добавит variants[].swatches для ключей из настройки.

Разметка в чанке строки

Цикл по массиву вариантов удобнее в Fenom-чанке (pdoTools):

fenom
{if $has_variants?}
  {foreach $variants as $variant}
    {set $sw = $variant.swatches.color ?: []}
    <button type="button" {if !$variant.in_stock}disabled{/if}>
      <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} / {$variant.options_array.size}
    </button>
  {/foreach}
{/if}

Поле swatches.color здесь соответствует ключу опции color. Если в настройке несколько ключей (color,material), смотрите swatches.material и т.д.

Структура одной записи swatch:

ПолеОписание
colorHEX без #
patternURL паттерна
titleПодпись из словаря
valueЗначение опции (есть даже без совпадения со словарём)

Без точного совпадения option_key + value со словарём поля color / pattern / title остаются пустыми.

Каталог с variants[].swatches

Только цвета товара без SKU

Если обходить варианты не нужно, в том же чанке вызовите сниппет:

fenom
{'!ms3OptionsColor' | snippet : [
  'product' => $id,
  'options' => 'color',
  'tpl' => 'tplMs3OptionsColor',
  'limit' => 6
]}
modx
[[!ms3OptionsColor?
  &product=`[[+id]]`
  &options=`color`
  &tpl=`tplMs3OptionsColor`
  &limit=`6`
]]

Корзина

Ветка с options._variant_id в чанке tplMs3OptionsColorCart показывает цвет read-only и ссылку на PDP ?variant=ID. Смену варианта и цену по-прежнему ведёт ms3variants. Подробнее: Вывод на сайте.

Типичные ошибки

СимптомЧто проверить
Нет variants[].swatchesusePackages=ms3Variants, настройка decorate = Да
Пустой swatches.colorЗначение опции буквально совпадает со словарём
Нет variants вообщеms3variants и параметр листинга
Стили свотча нулевыеms3optionscolor_frontend_css

Как устроено в событиях: События. Сценарий: Flow I. Настройка: Системные настройки.