Авг
29
44

Хаки для вариаций товаров в WooCommerce

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

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

Отображение только минимальной цены

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

Отображение минимальной цены товара в WooCommerce

Для реализации задачи добавляете в файл функций темы function.php (либо в custom-function.php) следующий код:

add_filter('woocommerce_variable_price_html', 'mycustom_variation_price', 10, 2);
add_filter('woocommerce_variable_sale_price_html', 'mycustom_variation_price', 10, 2 );
 
function mycustom_variation_price( $price, $product ) {
	if ( ! is_admin() && ((is_shop() || is_product_category() || is_page()))) {
     $price = '';
     $price .= woocommerce_price($product->get_price());
    } 
    return $price;
}

Здесь вы с помощью хуков заменяете стандартные функции отображения вариаций товара WooCommerce на свою. Также добавляем условие показа только в каталоге (главная, архив, отдельные страницы — is_shop, is_product_category, is_page).

К сожалению, у метода есть ряд «особенностей», на которые следует обратить внимание. Сам сниппет работает корректно, но он вносит определенную «неточность» при восприятии информации на сайте. Например:

  • У вас есть вариативный товар стоимостью $10-$30, и посетитель выбирает в фильтрах значение «от $20 и выше». Данная позиция будет отображена на странице в любом случае, но вместо диапазона в цене позывается минимальное знание — $10.
  • Может перестать работать «перечеркивание» для скидок на странице товара. Это не точно, но в каком-то из случаев акционная стоимость не хотела отображаться. Чуть позже добавил в условие is_single, и все заработало нормально. Если глюк останется, то теоретически можно дополнительно реализовать правильную обработку этого случая и подставить функцию в хук woocommerce_variable_sale_price_html. Если не использовать is_single (а оставить как в примере выше), то в блоке похожей продукции увидите диапазон цен, а не минимальную.
  • В админке, кстати, хак тоже срабатывает, что немного неудобно для редакторов — поэтому добавляем !is_admin.

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

Отображение цены вариации по умолчанию

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

Цены вариаций

Я, в принципе, стараюсь всегда указывать этот параметр дабы не возникало никаких «случайных несостыковок» на странице описания продукции магазина. Чтобы выводить данное значение в разделах добавьте в function.php следующие строки:

add_filter('woocommerce_variable_price_html', 'custom_variation_price_default', 10, 2);
add_filter('woocommerce_variable_sale_price_html', 'custom_variation_price_default', 10, 2 );
 
function custom_variation_price_default( $price, $product ) {
  foreach($product->get_available_variations() as $pav){
      $def=true;
      foreach($product->get_variation_default_attributes() as $defkey=>$defval){
          if($pav['attributes']['attribute_'.$defkey]!=$defval){
              $def=false;             
          }   
      }
      if($def){
          $price = $pav['display_price'];         
      }
  }   
 
  return woocommerce_price($price);
}

Решение найдено тут. По сравнению с предыдущим методом здесь чуть больше кода, но, к сожалению, «неточности» возникают такие же: с фильтрами, отображением товара «не в наличии», показом стоимости в админке. Единственное преимущество, делающее такой подход гибче — возможность выбора вручную какую цену выводить.

Вариации товара с одинаковыми ценами

Не знаю как в новых Woocommerce 3.x, но в предыдущей ветке точно закрался один странный глюк. Если у вас имеется товар с несколькими вариациями, для которых установлена одинаковая стоимость, то на странице с его описанием поле цены будет скрыто.

Глюк отображения цены в вариациях

Чтобы это исправить в файл функций добавляем:

add_filter('woocommerce_available_variation', function ($value, $object = null, $variation = null) {
    if ($value['price_html'] == '') {
        $value['price_html'] = '<span class="price">' . $variation->get_price_html() . '</span>';
    }
    return $value;
}, 10, 3);

Повторюсь, у меня этот косяк появляется в Woocommerce 2.6.x, возможно, в следующей версии он уже исправлен. Дополнительно советую глянуть плагин скидок и оптовых цен в WooCommerce.

Вариации товара в WooCommerce без выпадающего списка

Я думаю, выпадающий список — не лучший способ выбора вариаций на странице магазина WooCommerce. Как минимум, пользователю приходится делать дополнительное действие для просмотра доступных значений атрибутов, плюс не все смогут сходу сообразить куда нужно кликать и т.п. Поэтому решение с чекбоксами (Radio Buttons) выглядит куда более юзерфрендли.

Вывод вариаций товара в WooCommerce

В сети найдете разные хаки по данной задаче. Однако мне больше всего нравится реализация с помощью модуля — внедряется она максимально просто и быстро. Наибольшее доверие из имеющихся плагинов вызывает WC Variations Radio Buttons.

Плагин WC Variations Radio Buttons

На момент написания статьи последняя версия модуля имела чуть более 3 тысяч загрузок и хорошую оценку. В некоторых шаблонах решение может работать сразу после установки и активации. Если же разработчики внесли свои правки в файл WooCommerce магазина single-product/add-to-cart/variable.php, то вам нужно будет:

  1. Создать дочернюю тему (если ее нет).
  2. Скопировать файл из директории модуля plugins/wc-variations-radio-buttons/templates/single-product/add-to-cart/variable.php в ваш шаблон сюда — themes/ИМЯ_ТЕМЫ/woocommerce/single-product/add-to-cart/variable.php. Если там уже есть такой файл, замените его.

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

Если у вас имеются вопросы по теме поста как вывести вариации товара в WooCommerce, пишите ниже.

рейтинг Оцените статью:
Ужасная статьяНичего интересногоТак себеНормальноХорошоКлассный постВ закладки!
(голосов - 6, средний балл: 7,00 из 7)
Загрузка...

категория Категории: WooCommerce; Хаки и секреты;
теги Теги: , , , , .

комментария 44 к статье “Хаки для вариаций товаров в WooCommerce”

  • DiZeR   12.10.2018

    День добрый.

    В вариативных товарах Woo, есть возможность в каждой карточке товара задавать стартовый вариант отображения.
    Пример: Так если товаром является одежда с размерами S, M, L, XL — можно выбрать какой размер будет отображен при первом посещении страницы пользователем.
    Если принудительный выбор не делать (в зависимости от плагина или его отсутствия) будет выводиться надпись: «выберете…» «размер…» или что-то подобное.

    Вопрос: Есть ли способ\фикс\плагин\решение — которое позволит принудительно выставлять первый вариант (в примере это размер S) — всем товарам без принудительной настройки в каждой карточке товара Woo?

    P.S: кроме того, если определенный размер заканчивается на складе\был отключён (закончился размер S). Выбранным размером по умолчанию становиться M.

    Версия Woo — последняя.

  • DiZeR   13.10.2018

    Решение нашел сам — плагин — WooCommerce Force Default Variant

  • Tod   13.10.2018

    DiZeR, если честно я думал, что в Woo будет автоматические выводить вариации, но, насколько я помню, пришлось задавать базовое значение вручную. Вероятно, сложность в том, что система не знает какая именно у вас очередность подразумевается — для нее понять какой из «S, M, L» или «красный / белый / синий» должен быть первым, вторым и т.п. не так просто как человеку. Если бы я искал хак для задачи, то гугли бы что-то по типу «вывод/сортировка вариаций по ID или number (номеру в списке). Может когда-то в будущих версиях эту опцию добавят по умолчанию.

  • Tod   13.10.2018

    DiZeR, спасибо за наводку!)

  • gari   21.11.2018

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

  • Tod   23.11.2018

    gari, нужно гуглить, я не встречал такую задачу, не смогу подсказать.

  • Евг   26.01.2019

    Можно как-то сделать, чтобы при выборе разной вариации пользователю отправлялись разные сообщения на емайл? Продаю виртуальные товары и для каждой вариации у меня разный набор высылаемых текстов и ссылок. Как вариант — сделать вместо вариации самостоятельный продукт, но не хотелось бы их плодить лишний раз.

  • Tod   26.01.2019

    Евг, если честно, с такой задачей не сталкивался.. да и вообще с виртуальными товарами пока что не работал. Тут нужно оценивать затраты времени/денег — если нет готовых модулей и придется нанимать программиста, то возможно на первых порах запуска проекта эффективнее сделать самостоятельные продукты и для каждого разные картинки-превью. Я у одного разработчика такое видел (по 3 товара для одной темы) — не скажу, что меня сильно это напрягало как покупателя.

  • Алена   10.02.2019

    Здравствуйте, может кто подскажет в чем проблема, при создании вариативного товара в Вукомерсе на сайте отображается только оптовая цена

  • Tod   12.02.2019

    Алена, не совсем понимаю, что значит «оптовая цена». Вообще формат того, что будет показано на сайте, задается в шаблоне (или маловероятно — в дополнительных модулях). Можете попробовать переключиться на Вордпресс тему по умолчанию и глянуть как в магазине отображается ценник там. Если он выгляди по-другому, нужно разбираться в каком месте своего шаблона меняется данный формат цен.

  • Денис   16.02.2019

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

  • Tod   16.02.2019

    Денис, учитывая то, что я во всех сайтах использую вариации списком, то взял бы за основу решения модуль WC Variations Radio Buttons и в его коде в том месте где формируется список вариаций добавил проверку «если она в наличии, то выводить в списке, иначе — нет». Если используется другой плагин для вывода, то редактировал бы его код. Можно еще погуглить, вдруг есть какой-то фильтр под эту задачу, но я пока что, увы, такого не встречал.

  • Александр   24.05.2019

    Добрый день! Данный код выводит для всех вариативных товаров без товара по умолчанию максимальную цену и только там, где выбран товар по умолчанию выводится его цена. Есть ли какой-то вариант с выводом диапазона цен там, где по умолчанию товар не задан и одной цены где задан? Либо выводить в каталоге цену только вариантов в наличии (диапазон при нескольких вариантах) и не выводить товаров под заказ?
    У меня в магазине будут как простые, так и вариативные товары. Считаю более правильным и удобным для покупателя показывать именно диапазон цен для вариативных. Но у некоторых товаров есть еще возможность покупки со склада или под заказ. Естественно, под заказ с длительным ожиданием, без ограничения в количестве единиц и цена на 15-20% ниже чем со склада. Если единственной вариативностью товара оказывается наличие, то диапазон цен в каталоге может вызвать ложные ожидания и негатив. Отказаться от вариаций кроме наличия и выводить максимальную цену не хорошая идея, т.к. у части вариативных товаров вариации обозначают комплектность и некорректно делать карточки товара по комплектности.

  • Tod   24.05.2019

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

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


Блог Wordpress Inside поможет вам научиться работать в вордпресс, закрепить и расширить имеющиеся знания. Плагины и шаблоны, разные хаки и функции wp, оптимизация и безопасность системы – все это и намного больше вы сможете найти на страницах нашего проекта!

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

Поиск:
Последние посты
Заработай в GoGetLinks
Лучшее в категории
Облако тегов
Скажи свое мнение!

В чем основные плюсы Wordpress?

Посмотреть результаты

Загрузка ... Загрузка ...
Друзья проекта
Последние новости