1. Создаем или редактируем товар. В разделе “Данные Товара” выбираем “Вариативный товар”.
Обратите внимание, что появилась новая закладка “Wooswatches”

2. Заходим в Атрибуты. Выбираем “Индивидуальный атрибут товара” и нажимаем “добавить”.
(Справедливости ради стоит заметить, что не всегда нужно использовать Индивидуальный атрибут. Можно задать общие атрибуты в разделе Товары-Атрибуты и использовать их. Для косметики общие атрибуты менее актуальны, т.к. каждая единица имеет свою уникальную палитру.)

Далее заполняем имя индивидуального атрибута, ставим галочку “использовать для вариаций” и заполняем непосредственно сами вариации.

Вариации заполняются подряд в строку с разделителем “|”. (вертикальная черта или “pipe” shift+\  в англ раскладке). Ни пробелы ни переносы не нужны ни в начале ни в конце.

После заполнения не забываем нажать “Сохранить атрибуты”.

 

3. Переходим в Вариации,  в выпадающем меню выбираем “Создать вариации из всех атрибутов и нажимаем “применить”.

 

4. Далее можно заполнить каждую отдельную вариацию. По сути эта операция ничем не отличается от заполнения простого товара. Можно задать индивидуальное изображение для каждого товара. Если изображение не задано для вариации будет использовано главное изображение товара на фронтенде.




5. Можно задать цену сразу всем вариациям. Для этого в меня действия вариаций выбираем опцию – задать “базовую цену” и нажимаем “применить”. Так же там много других функций, которые можно применить ко всем вариациям сразу. Не забываем сохранять изменения.


6. Обновляем/Публикуем сам товар. Переходим на закладку “Wooswatches”. Нажимем на серое поле, чтобы раскрылось меню. (этих полей может быть несколько. Это зависит от количества атрибутов. Каждый атрибут имеет свою закладку. Выбираем “Custom Color” вместо “Default”.

– выбираем размер и форму (квадрат или круг)
– показывать ли атрибут на фронтенде
– цвет или картинку

Обновляем товар.
 


 

7. Запонять лучше всего использую расширение для Google Crome. Расширение называется Colorzilla. Оно позволяет делать захват цвета прямо из экрана браузера и копирует код цвета в клипбоард. После этого его тут же можно вставить без использования какого-либо редактора.