Домой / WordPress / Урок 5. Добавление вариативного товара в интернет-магазин WooCommerce
Урок 5. Добавление вариативного товара в интернет-магазин WooCommerce

Урок 5. Добавление вариативного товара в интернет-магазин WooCommerce

Здравствуйте друзья! Сегодня мы поговорим о создании вариативных товаров в интернет-магазине.

Что такое вариативный товар? Вариативный товар — товар который имеет различные свойства (вариации). К примеру, одежда может иметь несколько цветов (белый, черный, красный) и размеров (X, XL, XXL). В таких случаях нам и нужно создавать вариативные товары, чтобы покупатель мог выбрать необходимый цвет и размер при покупке товара в вашем интернет магазине. При добавлении вариативного товара в магазин на WooCommerce вы можете устанавливать индивидуальные фото (миниатюры) и задавать разную цену на каждую вариацию.

Напомню, что в прошлых уроках мы уже разобрали:

Как создать вариативный товар

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

Для этого заходим в Товары -> Свойства и создаем свойство Цвет и Размер.

Добавление вариативного товара в интернет-магазин WooCommerce

Добавляем новые свойства товара

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

Добавление цвета в свойства "Цвет"

Добавление цвета в свойства «Цвет»

По аналогии добавляем X, XL, XXL в свойство Размер.

3. Далее нам нужно создать новый вариативный товар или изменить уже созданный товар на вариативный. При создании товара нужно указать то, что он будет вариативным.

Для этого выбираем в выпадающем списке Вариативный товар (при создании по умолчанию стоит значение «Простой товар»). После этого переходим на вкладку Свойства.

Выбираем "Вариативный товар" и переходим на вкладку "Свойства"

Выбираем «Вариативный товар» и переходим на вкладку «Свойства»

4. После перехода в вкладку Свойства выбираем из выпадающего списка свойство Цвет и нажимаем кнопку «Добавить».

Добавляем свойство "Цвет "

Добавляем свойство «Цвет «

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

Важно!!! Обязательно ставим галочку в «Использовать для вариаций» и после добавления всех значений нажимаем кнопку «Сохранить свойства».

Выбираем значения для вариаций Цвета и Размера

Выбираем значения для вариаций «Цвета» и «Размера»

5. Теперь переходим на вкладку Варианты и нажимаем Присоединить все варианты и в окошке которое появилось подтверждаем наше действия нажав ОК. После нажатия кнопки вы создадите все возможные комбинации свойств вариантов. Что это значит? Это значит что на каждый цвет будут все размеры, а на каждый размер — все возможные цвета. Такой способ является самым быстрым при добавлении множества вариантов.

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

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

Добавление вариативного товара в интернет-магазин WooCommerce

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

Указываем обычную цену и цену со скидкой. Также задаем разные миниютюры.

Указываем обычную цену и цену со скидкой. Задаем разные миниатюры для вариаций если необходимо.

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

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

Вот так выглядит результат добавления вариативного товара из этого урока:

Результат добавления вариативного товара

Результат добавления вариативного товара в WooCommerce

Если у вас возникли вопросы — пишите в комментариях.

Здравствуйте друзья! Сегодня мы поговорим о создании вариативных товаров в интернет-магазине. Что такое вариативный товар? Вариативный товар - товар который имеет различные свойства (вариации). К примеру, одежда может иметь несколько цветов (белый, черный, красный) и размеров (X, XL, XXL). В таких случаях нам и нужно создавать вариативные товары, чтобы покупатель мог выбрать необходимый цвет и размер при покупке товара в вашем интернет магазине. При добавлении вариативного товара в магазин на WooCommerce вы можете устанавливать индивидуальные фото (миниатюры) и задавать разную цену на каждую вариацию. Напомню, что в прошлых уроках мы уже разобрали: Урок 1. Установка и русификация плагина интернет-магазина Woocommerce Урок 2. Настройка ЧПУ (постоянных ссылок) в WooCommerce…

Обзор

Проголосуйте за урок

Оценка

Итог : Уважаемые читатели! Если вам понравилась статья не поленитесь проголосовать и оставить комментарий, ведь так я смогу понять полезность уроков и статей, и улучшить их качество в будущем. Заранее спасибо!

Рейтинг: 4.21 ( 21 голосов )
100

390 комментариев

  1. Аватар

    Спасибо за Ваш урок) Очень помог при настройке!

  2. Аватар
    Валерия

    Здравствуйте!Посоветуйте по следующему вопросу (может сталкивались):
    Товар вариативный.
    После выбора 1-го варианта нужно чтобы выпадало две строчки для следующего выбора.
    Если человек выбирает второй вариант, то нужно чтобы выпадало четыре строчки для последующего выбора.
    Если человек выбирает третий вариант, то должно выпадать шесть строчек выбора.
    Зависимость цены есть только при первом выборе, т.е когда выбирает первый, второй или третий вариант..
    Как это можно реализовать?

  3. Аватар

    Александр вечер добрый. Есть небольшая проблема. На сайте существуют вариативные товары. С ними проблем нет но после подтверждения заказа появляестся информация о нем где ни сном ни духом не указывается ни размер как в моем случае ни цвет ну и соответственно в письме клиенту аналогично т.е. все данные есть кроме атрибутов….посмотреть можно тут lytick.com Подскажите где бяка зарылась?

    • Аватар

      Если Вы обновили WordPress и WooCommerce и все осталось по прежнему — вероятнее всего, что Вы допустили ошибку при редактировании файлов темы (или тема нуждается в обновлении).

      • Аватар

        Вот буквально только что обновил все что можно было — проблема не ушла, чек боксы реализовывались WooCommerce Product Add-ons а по сему для чистоты эксперимента плагин был не просто отключен а удален но к сожалению воз там где и был. Версии вордпреса и вукомерса актуальна на момент написания поста 🙁 Увы и ах…

        • Аватар

          Таки это был гаденыш WooCommerce Product Add-ons 🙁 Ни у кого там рабоче-способной версии нету? Послал бы но к сожалению необходимо решение с чекбоксами….

  4. Аватар

    Здравствуйте! у меня проблема в интернет-магазине с вариативными товарами.
    Когда выбираю опцию товара(цвет, вариант полотна, наличник и короб) у меня выдается не тот товар, который должен отображаться.
    Помогите пожалуйста!

    • Аватар

      Заказ выглядит примерно вот так

      Заказ #701
      Товар Количество Цена
      Платье 0001 (#0001)
      Цвет:
      Размеры:
      Размеры: 5 100.00 ₴
      Подытог: 100.00 ₴
      Доставка: Новя Почта Украина
      Способ оплаты: Наложенный платеж
      Всего: 100.00 ₴

    • Аватар

      Ну походу дела нужно поиграться с самими вариациями. Если Вы в карточке товара указали все верно то проблем не должно быть но к вас 4 параметра если я правильно понял то одно полотно может быть как различное по цветам но также еще и различаться по типу полотна коробке и наличнику т.е. 1 цвет и фиг еще сколько параметров там будет. В вариациях есть параметр как создать смесь всех вариантов — выбирать конечно из списка придется долго но вы будете уверены что там будут присутствовать любые комбинации из того что вы вводили. Просто у меня по аналогии 15 цветов + 10 размеров + состав ткани….Комбинатория получалась внушительная.

  5. Аватар

    Александр есть вопрос по вариациям… К примеру существует 2 цвета и 4 размера, Мне необходимо выбрать определенное количество товаров в разных вариациях «цвет-размер» но тут есто но, Выбираю цвет+ размер ввожу кол-во и добавить, список цвет перебрасывает в «Выбрать опцию», список размер остается неизменным и приходится опять выбирать цвет. Возможно ли сделать так что после выбора цвета-размера-кол-ва и нажатия кнопки добавить значения в списках вариаций не изменялись и при этом не пропадало поле ввода кол-ва приобретаемого товара?
    фффуф…

  6. Аватар

    Здравствуйте, у меня есть такая проблема с сайтом (интернет-магазин):
    Когда человек совершает покупку, мне приходит письмо на мейл с данными заказчика и товара который он покупает, но проблема состоит в том что в товаре (одежда) должен присутствовать тот размер который выбрал покупатель, но его нет. И в админке так же его нет. Т.е. я не знаю какой именно размер человек заказал. Где можно посмотреть причину ошибки?

    • Аватар

      Здравствуйте. Извините за задержку с ответом. Для начала нужно понять где именно проблема, в теме или возможно в плагине. Попробуйте проверить на другой теме, со всеми включенными плагинами и остальными настройками. Также убедитесь, что используете последние версии WP и WooCommerce.

  7. Аватар
    Дмитрий

    С нуля создал на поддомене сайт, установил woocommerce, при добавлении партнерского товара вставляю ссылку на него, публикую товар, и ссылка сразу пропадает из строчки, все остальные строки остаются заполнены. В чем может быть проблема? Плагины отключал лишние — то же самое. Не пойму, где искать проблему?

    • Аватар
      Дмитрий

      Вопрос решился удалением «http://» в начале ссылок. Теперь все сохраняется нормально

  8. Аватар
    Дмитрий

    Доброго времени суток!
    Можно ли добавить возможность выбора вариаций в случае не с вариативным, а с партнерским товаром? Может ли какой то плагин или редактирование кода решить такую задачу?

    • Аватар
      Дмитрий

      Жаль, что никто не знает ответа на мой вопрос! Вот онлайн интернет магазин «Товары для дома» на вордпресс — internet-magazin.muzhik-v-dome.ru. Хочется сделать так, чтобы, например, один и тот же шуруповерт, но красного и черного цветов, можно было выбирать нажатием соответствующей иконки, как это реализовано, скажем, на Озоне. Хотя, конечно, выбор цвета в партнерском интернет-магазине может и лишнее, но, например, если говорить о жестких дисках, то выбор одной модели разного объема — уже более существенно и наглядно дает возможность покупателю видеть, что, собственно, ему предлагают.

  9. Аватар

    После добавления более 30 вариаций товара появляется «Жаль, но товаров, соответствующих вашему выбору, не обнаружено. Пожалуйста, выберите другую комбинацию.» И даж не знаю че делать, max input vars увеличил, не помогло((

  10. Аватар

    здравствуйте

    У меня много товаров и много цветов и размеров, но при размещении WordPress дает 50 вариаций, а потом или смещает большую часть цветов в характеристики или нет вариаций для выбора нужного размера и цвета. Подскажите, пожалуйста, КАК МОЖНО УВЕЛИЧИТЬ КОЛЛИЧЕТСВО ВАРИАЦИЙ в WordPress? Или как сделать, чтобы работало и принимало все цвета для всех размеров?

  11. Аватар

    Добрый день!
    Стараюсь сделать интернет-магазин, Но есть несколько проблем..
    Я сделала страницу «Украшения», добавила украшения по рубрикам: «Браслеты», «Колье» и прочее, НО заходя на страницу «Украшений» этих рубрик нету вовсе..
    Как быть?
    И как изменить шрифт написания статей и описания товара? Очень-очень маленький и тоненький..
    Буду благодарна за помощь!

  12. Аватар

    Эта статья мне оказалась мега-полезной! Большое Вам человеческое СПАСИБО!

  13. Аватар
    Александр

    Доброго времени суток)
    Подскажите, интернет магазин на нем размещен товар у товара есть несколько размеров что отличается ценой, при этом к тому товару нужно добавить варианты»скажем дополнения» при этом чтоб дополнения меняли цену(суммировалось)
    Пример:двери 3-х размеров разная цена, могут продаваться как сама дверь, а можно добавлять, варианты наличников, варианты коробок, варианты фурнитуры, это реально на wp? установлен плагин woocommerce может я что-то не так делаю?
    Зарание благодарен!

    • Аватар

      Такой возможности нету. Если добавить вариации (коробки, фурнитура), то они будут обязательны для выбора. Как вариант, можно попробовать их сделать по хитрому. К примеру в вариацию коробка добавить свойство «нету», и поставить его по умолчанию к вариации, установив на вариацию цену 0.

  14. Аватар

    очень помог. Спасибо большое

  15. Аватар

    Александр, добрый день!
    На вас вся надежда(( Не могу найти ответа по всему интернету. Я сделала все товары вариативными — и у меня исчезли картинки. Изначально была одна картинка на товар, который я прицепила через «миниатюру товара», а после добавления вариаций она исчезла. Смотришь товар — описание есть, вариации есть, а картинки нет. Причем если смотреть категории товаров, то там все ок — миниатюры на месте.

  16. Аватар

    Здравствуйте Александр!
    Я меня такая проблема товары на витрине не ровные как можно ‘то исправить?
    разного размера картинки я их делал одинаковыми но это не помогло((
    Плагин woocommerce!

    • Аватар

      Если изображения одинакового размера, значит неровность от «длины» названий товаров. Попробуйте увеличить в CSS line-height для названий товаров.

  17. Аватар

    Добрый день!
    Товар вариантный.
    Заместо «очистить выбор», сейчас появилось «нулевой», как удалить это слово или переименовать?
    Как убрать в выборе варианта текст «выбрать опцию»?
    WooCommerce Версия 2.5.2, обнова как я понял вообще хрень, пропал знак рубля Р, заместо него квадрат, что можно сделать? (я выбрал филипинскую валюту, она норм отображается).
    Спасибо.

  18. Аватар

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

    • Аватар

      Здравствуйте. Попробуйте изменить тему. Если проблема останется, тогда нужно будет проверить WooCoomerce и настройки сервера/хостинга. Если нет — проблема в используемой Вами теме сайта.

  19. Аватар
    Дмитрий Петров

    Здравствуйте! Создал вариативный товар. Теперь после выбора свойства появляется ошибка: Пожалуйста, укажите опции товара… В чем может быть причина?

  20. Аватар

    Добрый день, установили плагин вариативного товара, в старой теме раннее купленной все отлично работает, в новой теме не отображает ниего. подскажите, пожалуйста в ем может быть проблема?

    • Аватар

      Здравствуйте. Судя по Вашему описанию — проблема в теме. Убедитесь что она совместима с WooCoommerce и напишите создателю темы.

      • Аватар

        Написано что тема совместима( написала создателю, они пнислали линк на инстуркцию добавления товара, все сделала, не отображает(((

      • Аватар

        и еще, например, если вставлено «вариативный товар», он на странице не отображается, но когда делается заказ, на странице появляется предупреждение, мол, выберите опцию товара

Оставить комментарий

Ваш email не будет опубликован.

*