Как создать варианты продукта WooCommerce

Опубликовано: 2022-06-08

Хотите узнать о вариантах продукта WooCommerce ?

В этом полном руководстве вы легко поймете, что такое варианты продуктов WooCommerce и как создавать вариативные продукты с желаемыми вариантами. И не забывайте о вариациях продукта с помощью образцов вариаций.

Но прежде чем перейти к подробным объяснениям, вы должны знать, что такое переменные продукты и варианты WooCommerce.

Содержимое скрыть
1 Что такое вариативные продукты WooCommerce?
2 Что такое атрибуты продукта WooCommerce?
3 Что такое варианты продукта WooCommerce?
4 Как настроить переменный продукт WooCommerce с несколькими вариантами
4.1 Создание и настройка атрибута продукта
5 Создайте переменные продукты
5.1 Сделать атрибуты доступными для вариантов
5.2 Создание вариантов из всех атрибутов
5.3 Настройка вариантов
6 Как настроить разные продукты WooCommerce с разными ценами
7 Как стилизовать варианты продукта WooCommerce
8 Заключение

Что такое переменные продукты WooCommerce?

Переменные продукты WooCommerce относятся к тем продуктам, для которых владельцы магазинов могут добавлять несколько атрибутов для продукта. Есть несколько вариантов, которые вы можете добавить к определенному продукту. Размер и цвет — это наиболее часто используемые варианты, которые вы можете добавить к желаемым продуктам. Мало того, все переменные могут иметь свои изображения продукта, цену и запас.

Что такое атрибуты продукта WooCommerce?

Атрибуты продукта относятся к термину, с помощью которого мы можем настраивать переменные продукты WooCommerce. Атрибуты продукта включают размер, цвет и изображения. Для этих атрибутов мы можем установить несколько значений. Например, значения атрибутов размера могут быть «Маленький», «Средний» и «Большой».

Что такое варианты продукта WooCommerce?

Переменные продукты WooCommerce могут иметь несколько атрибутов продукта. Итак, если мы используем два или более атрибута вместе для одного продукта, это называется вариантами продукта. Например, футболка, которую мы продаем, может быть разных цветов и размеров. Таким образом, мы должны внести изменения в эти атрибуты, чтобы покупатели могли выбрать желаемый размер и цвет футболки.

Как настроить переменный продукт WooCommerce с несколькими вариантами

Теперь, когда вы знаете все самое важное о вариативных продуктах WooCommerce, пришло время помочь вам создать доступные продукты с нуля. Fort, что вы выполните следующие шаги:

Создание и настройка атрибута продукта

Первым и наиболее важным аспектом создания или изменения продукта является создание атрибутов продукта. Есть два способа создания атрибутов: мы можем создать глобальные атрибуты или атрибуты уровня продукта.

Глобальные атрибуты будут доступны для всех продуктов. С другой стороны, атрибуты уровня продукта предназначены для конкретных продуктов. Это означает, что если вы создаете атрибуты, которые вы создаете на уровне продукта, они будут доступны только для этого продукта.

Я объясню оба способа, чтобы вы могли решить и создать, следуя тому, как вы хотите.

Создать глобальный атрибут: Чтобы создать глобальный атрибут, выполните следующие действия:

  • Перейдите на вкладку «Атрибуты» в разделе «Продукты».
  • Введите имя атрибута
  • Введите имя слага (необязательно)
  • Установите флажок Включить архивы (необязательно)
  • Нажмите кнопку Сохранить
Create Global Attribute
Создать глобальный атрибут

После создания глобального атрибута его необходимо настроить со значениями. Например, если вы создаете атрибут размера, вам также нужно добавить доступные размеры, верно?

Чтобы настроить атрибут, выполните следующие действия:

  • Нажмите на кнопку настройки
  • Добавить желаемое имя значения
  • Добавьте имя и описание слага (необязательно)
  • Нажмите на кнопку добавить новую
configure attribute
настроить атрибут

Это все значение, которое вы хотите создать, будет доступно на правой стороне. Таким же образом вы можете добавить все желаемые значения атрибутов.

Создание атрибута уровня продукта. Теперь пришло время обсудить создание атрибута уровня продукта. Вы можете создавать их при создании переменных продуктов. Вот как:

  • Нажмите на вкладку Атрибуты
  • Выберите «Пользовательский атрибут» и нажмите кнопку «Добавить».
  • Введите имя атрибутов
  • Добавить значения атрибутов
  • Сделайте его доступным для страницы продукта и вариантов

Вот и все, теперь вы можете создавать вариативные продукты с желаемыми вариациями.

Создать переменные продукты

Теперь вы узнали как о способах создания атрибутов, так и о кобфикации. Пришло время создавать вариативные продукты. Процесс может быть запутанным, если вы делаете это в первый раз. Не волнуйтесь, просто следуйте приведенным ниже шагам, и вы сможете легко создавать вариативные продукты.

Сделать атрибуты доступными для вариантов

Как я уже упоминал, вы должны сделать атрибуты доступными для вариантов, вы можете пропустить этот шаг, если хотите создать атрибуты на уровне продукта. Но для глобального атрибута все немного иначе.

Чтобы сделать глобальные атрибуты доступными для вариантов, выполните следующие действия:

  • Нажмите на атрибуты при создании переменного продукта
  • Выберите нужный глобальный атрибут из раскрывающегося списка.
  • Выберите нужные значения или нажмите кнопку «Выбрать все».
  • Сделайте его доступным для страницы продукта и вариантов
Make Attributes Available for Variations
Сделать атрибуты доступными для вариантов

Создание вариантов из всех атрибутов

После того, как желаемые атрибуты доступны для вариантов, пришло время создать варианты со всеми атрибутами. Для этого:

  • Нажмите на вкладку вариантов
  • В раскрывающемся списке выберите вариант создания вариантов из всех атрибутов.
  • Нажмите кнопку «Перейти»
Create variations from all attributes
Создание вариантов из всех атрибутов

Теперь WooCommerce создаст все возможные варианты с комбинациями. Позже вы настраиваете их с желаемой ценой, изображением и запасом.

Примечание. Различные варианты могут иметь разные изображения, цены и запасы. Однако вы добавляете одинаковую цену для всех доступных вариантов.

Настроить варианты

При настройке вариантов необходимо расширить все параметры вариантов и добавить необходимые значения. Однако, как я упоминал ранее, вы можете добавить одну и ту же цену для всех вариантов. Для этого:

  • Нажмите на раскрывающийся список еще раз после внесения изменения
  • Выберите опцию «Установить обычные цены».
  • Нажмите кнопку «Перейти»
  • Добавьте желаемую цену
  • Нажмите на кнопку ОК
Set Regular Prices
Установить обычные цены

Теперь все варианты будут иметь одинаковую цену. После правильной настройки переменного продукта нажмите кнопку «Сохранить изменения» и опубликуйте сообщения. После этого вы можете просмотреть переднюю часть страницы продукта.

Как настроить разные продукты WooCommerce с разными ценами

Как я уже упоминал, вы также можете установить разные цены, изображения и запасы для каждого из вариантов, вот как вы можете это сделать:

  • Перейти на вкладку вариации
  • Развернуть все варианты
  • Добавить желаемые цены, изображения и акции
  • Нажмите сохранить изменения
  • Опубликовать или обновить продукт

Вот и все, варианты вашего продукта теперь доступны по разным ценам. Таким образом, когда покупатели выбирают желаемые варианты товара, они видят точную цену за этот вариант.

Как стилизовать варианты продукта WooCommerce

Представление вариативных продуктов WooCommerce по умолчанию хорошее, но не самое лучшее. Вы были бы удивлены, узнав, что 22% из 1 миллиона лучших сайтов электронной коммерции созданы с помощью WooCommerce. Но это не значит, что WooCommerce по умолчанию было достаточно, чтобы сделать красивый и ориентированный на конверсию сайт.

Им потребуется нанять разработчиков или приобрести премиальные темы и плагины, чтобы сделать их WooCommerce визуально привлекательными и ориентированными на конверсию.

Так почему бы вам также не попытаться сделать свой сайт более привлекательным, используя сопутствующий плагин для WooCommerce?

Вы, вероятно, думаете о том, какой плагин вам следует выбрать. Что ж, в WordPress доступно множество плагинов для расширения существующих функций WooCommerce. Однако рекомендуется выбирать плагин «все в одном» вместо нескольких плагинов и плагинов для разных функций. Потому что использование нескольких плагинов на сайте WordPress вообще не рекомендуется.

Это может испортить ваш сайт, сделав его медленнее, чем раньше.

Плагин ProductX Gutenberg WooCommerce — один из лучших компаньонов для WooCommerce. Он поставляется с блоками продуктов, стартовыми пакетами (готовыми шаблонами), основными функциями и надстройками.

Образцы вариаций — одно из лучших дополнений ProductX. С помощью которого вы можете сделать варианты продукта визуально привлекательными.

Ниже приведены доступные способы стилизации вариаций продукта с помощью надстройки «Образцы вариаций».

Преобразование выпадающего списка в образцы. Прежде всего, вы преобразуете стиль вариации WooCommerce по умолчанию в красивые образцы. Как вы уже знаете, варианты продуктов WooCommerce по умолчанию поставляются с раскрывающимися вариантами выбора. Варианты могут быть названия цветов и размеров. Но с помощью дополнений вы можете преобразовать их в нужные цвета и метки вместо названий цветов и размеров.

Convert Dropdowns to Swatches
Преобразование раскрывающегося списка в образцы

Создание образцов цвета. Как только вы начнете использовать надстройку «Образцы» в ProductX, вы сможете получить больше возможностей при создании и настройке глобальных атрибутов. Он позволяет выбрать нужные цвета в качестве значений атрибута цвета. Таким образом, цвета будут отображаться вместо названий цветов.

Color Swatches
Образцы цветов

Создание образцов меток: вы также можете отображать метки вместо названий размеров при создании и настройке атрибута размера. Например, когда вы добавляете атрибут размера как средний, вы также получаете возможность добавить метку как M или что угодно.

Labels
Образцы этикеток

Создавайте образцы изображений: вы будете удивлены, узнав, что вы также можете отображать изображения продуктов как варианты продукта. Для этого вам просто нужно установить изображение как тип типа атрибута цвета. И тогда вы сможете присвоить нужным изображениям названия цветов.

Image Swatches
Образцы изображений

Узнать больше: Образцы вариантов WooCommerce

Вывод

Это все о вариантах продукта WooCommerce и о том, как вы можете их стилизовать. Теперь можно приступить к созданию вариативных продуктов и стилизовать их с помощью образцов вариаций. Не стесняйтесь комментировать ниже, если вы столкнулись с какими-либо трудностями.

Нравится эта статья? Распространить слово
  • WordPress Menu Customization in 2022 WordPress Theme

    Настройка меню WordPress в теме Twenty Twenty two

  • How to Convert Gutenberg Blocks into Shortcode 1

    Как преобразовать блоки Гутенберга в шорткод

  • Security Update: WPXPO Products

    Важное обновление безопасности для PostX и ProductX

  • WordPress Gutenberg Tutorial

    Лучшее руководство по WordPress Gutenberg 2021 [Руководство для начинающих]