Woocommerce вывести последние товары

Учимся использовать рекомендованные товары в WooCommerce

Рекомендованные товары (англ.: Featured Products) – один из способов акцентирования внимания посетителя сайта на определенных товарных позициях, которые можно вывести на страницах и в записях с помощью виджета, шорткода, блока визуального редактора контента Gutenberg. По мере развития интернет-магазина WooCommerce, способы отображения этой категории реализуемой продукции неоднократно менялись. В этой статье мы кратко рассмотрим историю изменений, разберемся, как создать и настроить рекомендованные товары WooCommerce, как вывести их на страницах и в записях в разных версиях расширения электронной коммерции.

Терминология

Слово «рекомендованный» – слишком вольный перевод «featured». В контексте функционала электронного магазина этому термину скорее соответствует словарное определение «имеющий характерные особенности» (английский) или «прославленный», «нашумевший», лучший в своем роде (американский английский). Если «featured actor» – актер первого плана, исполнитель главных ролей в фильмах/спектаклях, то «featured product» – это скорее не рекомендованный, а лучший продукт в своем роде. Или имеющий характерные особенности, выгодно отличающие его от аналогичных товаров. Причем сама суть преимущества, будь то идеальное соотношение цены и качества, выдающиеся технические характеристики или неординарный дизайн, остается за кадром.

История изменений

• 2.1: определение новой функции wc_get_featured_product_ids(), дающей на выходе список ID рекомендованных товаров;
• 2.5.0: появляется WC_Widget_Products, расширение класса WC_Widget (входит в WP_Widget);
• 3.0: прекращена поддержка старой функции woocommerce_get_featured_product_ids();
• 3.2 исключен шорткод [featured_products];
• 3.2 вывод рекомендованных товаров включен в шорткод [products];
• 3.6: блок Featured Product, работающий в связке с редактором Gutenberg;
• 3.7: в рамках новой модели «Features as Plugins» началась «обкатка» блоков в расширении WooCommerce Blocks, определенном 18 октября 2018 года как «feature plugin» (функции для бета-тестирования, которые планируется позднее включить в ядро WooCommerce).

Дополнение WooCommerce Blocks разрабатывалось под редактор Gutenberg, впервые появившийся в WordPress 5.0. Первоначально Featured Product и другие блоки подключались с помощью расширения Products Blocks, определенного как «Feature Plugin», в который входят новые экспериментальные функции, нуждающиеся в бета-тестировании.

При следующем апдейте добавили предварительный просмотр в режиме реального времени. В последних релизах WooCommerce (начиная с версии 3.6) стабильные версии блоков, уже «обкатанные» в плагине WooCommerce Blocks, включаются непосредственно в ядро интернет-магазина как блоки визуального редактора контента Gutenberg.

Как создать Featured Products

Товар можно сделать «рекомендуемым» на странице с перечнем продукции в консоли администрирования. Для этого нужно либо нажать на значок с изображением звездочки справа от нужного объекта в общем списке, либо в редактировании свойств отдельного продукта поставить флажок в чекбоксе «Рекомендуемый» (Featured) справа от выпадающего списка «Видимость» (Visibility) в секции «Данные товара».

Еще один способ – установить флажок в соответствующем чекбоксе в блоке опций «Опубликовать» нужной товарной позиции. Флаговая кнопка находится прямо над «ОК».

Шорткоды [featured_products] и [products]

В плагине электронной коммерции WooCommerce до версии 3.2 для отображения товаров использовалось несколько шорткодов, включая [top_rated_products] (лучшие по рейтингу), [recent_products] (последние добавленные), [best_selling_products] («бестселлеры», лучше всего продающиеся) и другие. За отображение рекомендованных товаров отвечал шорткод [featured_products]. Пример использования:

[featured_products per_page=”8″ columns=”2″ orderby=”date” order=”desc”]

Этот шорткод выводит 8 рекомендованных товаров в две колонки. Товарные позиции сортируются по дате в порядке убывания.

Начиная с версии 3.2, все эти функции включены в шорткод [products]. Он существовал и ранее, но в ранних релизах отвечал только за вывод нескольких товарных позиций по списку ID или артикулов (SKU). Чтобы отображать на странице или в записи рекомендованные товары, аргументу ‘visibility’ должно быть присвоено значение «featured». Пример:

[products limit=”6″ columns=”2″ visibility=”featured”]

Этот шорткод загрузит до шести первых рекомендованных товаров в два столбца. По умолчанию товарные позиции сортируются по алфавиту, от A до Z и от «А» до «Я», однако порядок сортировки может быть переопределен аргументами ‘orderby’ и ‘order’. Описание этих и других атрибутов смотрите в официальной документации WooCommerce (Getting Started > Settings & Options > Shortcodes).

Блок Featured Product

Блок Featured Product доступен в электронном магазине WooCommerce версии 3.6 и выше, а также в плагине Products Blocks (WooCommerce Blocks). При разработке виджета программисты Automattic пошли по пути упрощения. В первых релизах блок включал в себя множество опций, в том числе переключатели отображения названия и рейтинга товара, цены, кнопки «Добавить в корзину». В последующих версиях количество настроек сократилось до четырех и даже до двух. Первый вариант (4 опции): источник списка товарных позиций (по умолчанию «All Products», «Все товары»), бегунки и текстовые поля количества колонок и рядов, порядок сортировки в виде выпадающего списка. Вариант с двумя опциями: название, количество товаров для отображения.

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

Виджет WooCommerce Products

Чтобы использовать виджет WooCommerce Products на своем сайте WordPress, нужно зайти в консоль администрирования WP > Appearance («Внешний вид») > Widgets и перетащить его мышкой (drag-and-drop) в сайдбар либо в другое место, где вашей темой предусмотрена установка виджетов. Если кликнуть по не активированному виджету, в выпадающем списке покажутся все места, где его можно разместить. Например:

• Sidebar (боковая панель);
• Below Header (под шапкой сайта WordPress);
• Footer Column 1 (первая колонка футера);
• Footer Column 2 (вторая);
• Footer Column 3 (третья);
• Footer Column 4 (четвертая).

Также виджеты можно размещать на страницах и в записях с помощью Assistant, встроенного инструмента WooCommerce.

Для вывода на экран рекомендованных товаров в выпадающем списке опции Show («Показать») должен быть выбран пункт ‘Featured Products’. Опции виджета:

• Products: источник, по умолчанию – пункт выпадающего списка Products («Все товары»);
• Title: название модуля (текстовое поле);
• Number of products to show: количество товаров для отображения (текстовое поле);
• Show: Featured Products (выпадающий список);
• Order by: параметр для сортировки (выпадающий список);
• Order: порядок сортировки (выпадающий список);
• Hide free products: скрыть бесплатные товары (чекбокс);
• Show hidden products: отобразить скрытые товары (чекбокс).

В нескольких вариантах русской локализации WooCommerce опция ‘Order’ переводится как «Заказ», что может сбить с толку пользователя. На самом деле, здесь это слово означает «Порядок [сортировки]».

Задача: отобразить 10 последних добавленных товаров с атрибутом «рекомендованный».

Опции: Количество товаров = 10, Показать = Featured Products, Сортировка = Date («Дата»), Порядок сортировки (Order) = DESC (по убыванию).

Задача: отобразить 6 случайным образом выбранных товаров с атрибутом «рекомендованный».

Опции: Количество товаров = 6, Показать = Featured Products, Сортировка (Order by) = Random.

WC_Widget_Products входит в класс WC_Widget, расширение класса WP_Widget, начиная с версии 2.5.0 WooCommerce. Более подробную информацию по классам и функциям отображения товаров (в том числе рекомендованных) можно найти в руководстве разработчика WooCommerce Code Reference в официальном профиле интернет-магазина в сервисе GitHub.

Плагин Featured Products First для WooCommerce

Если вам нужно опубликовать некоторые товары прежде всех остальных, можно воспользоваться компактным и нетребовательным плагином Featured Products First для WooCommerce. У расширения есть премиальные подписки, однако базовый (бесплатный) функционал достаточен для большинства пользователей.

Краткая справка о расширении:

• автор: Prashant Baldha;
• текущая версия: 1.8;
• количество активных инсталляций: около 1000;
• последний апдейт: 2 года назад;
• пользовательский йрейтинг WordPress: 4;
• WordPress: 3.0 и выше, тестировано до 4.9.16;
• PHP: 5.3 и выше;
• поддержка: через форум WordPress.org;
• цена: бесплатно, от $7,42/месяц.

Стоимость премиальной подписки составляет:

• $19/месяц (при помесячной оплате);
• $7,42/месяц (при оплате годовой подписки, $89);
• $199 (пожизненная лицензия).

Особенности Featured Products First (бесплатный план):

• вывод рекомендованных товаров перед остальными на главной странице магазина, в в результатах поиска, архиве категорий продукции;
• виджет Featured Products First в панели администрирования;
• многоязычная поддержка;
• включение/отключение опции вывода рекомендованных товаров первыми в списке.

К сожалению, порядок сортировки меняется только в платных пакетах плагина. Также в премиальной подписке расширяется «география» возможных мест вывода продукции с функцией Featured Products First. Большинство пользователей прекрасно обходятся без этих двух опций.

Плагин WooCommerce Gutenberg Products Blocks

Стабильные версии Featured Product и других блоков интегрируются непосредственно в ядро WooCommerce. Расширение Products Blocks есть смысл устанавливать лишь в том случае, если хотите протестировать экспериментальные функции, еще не включенные в расширение интернет-магазина.

Краткие сведения о плагине WooCommerce Blocks:

• разработчик: Automattic;
• текущая версия: 3.7.0;
• полное название расширения: WooCommerce Gutenberg Products Blocks;
• краткие названия: WooCommerce Blocks, Products Blocks;
• официальный сайт: woocommerce.com;
• дата создания: 18 апреля 2018 г.;
• последнее обновление: 5 дней назад;
• версия WordPress: 5.0 и выше, рекомендуется 5.3 и выше, тестировано до 5.5.3;
• PHP: 5.6 и выше (рекомендуется 7.2 и выше);
• версия WooCommerce: 4.2 и выше (рекомендуется 4.3 и выше);
• версия БД MySQL: 5.0 и выше (рекомендуется 5.6 и выше);
• необходимое программное обеспечение: WooCommerce + Gutenberg;
• рекомендуемые настройки сервера: память WP не менее 128 Мб, поддержка HTTPS;
• количество активных установок: более 200000;
• языки интерфейса: 16, включая украинский и русский;
• цена: бесплатно.

Образцы оформления товаров с помощью блоков находятся в sample_products.csv. Для импорта данных можно воспользоваться стандартным инструментом Product CSV Importer and Exporter (интегрирован в WooCommerce 3.1.x и выше) или официальным плагином CSV Import Suite.

Заключение

Возможность представить рекомендованные товары WooCommerce на страницах и в записях сайта на CMS WordPress – неплохой вариант акцентирования внимания потенциального покупателя на определенной продукции. Featured Products может стать неплохим вспомогательным маркетинговым инструментом для повышения конверсии вашего электронного магазина. Главное – правильно этим инструментом воспользоваться.

Источник

Как вывести недавно просмотренные товары

В этом уроке хочу показать вам, как создать шорткод для вывода недавно просмотренных пользователем товаров. Он у нас будет работать на основе стандартного шорткода WooCommerce, [products] .

Прежде, чем я покажу вам готовый код шорткода, хочу порекомендовать свой видеокурс по WooCommerce, в котором мы создаём тему для интернет-магазина с нуля на основе только готовой HTML-вёрстки, вот ссылка.

Недавно просмотренные товары будут отображаться на основе уже существующих стилей в вашей теме, это пример для темы Storefront.

Шаг 1. Ставим куки

Вообще в WooCommerce существуют свои собственные куки, которые хранят ID недавно просмотренных товаров $_COOKIE[ ‘woocommerce_recently_viewed’ ] в виде строки, разделённых палкой | , однако, они будут пустыми, если вы в то же время не используете виджет «Недавно просмотренные товары».

Поэтому нам придётся установить собственные.

Я решил использовать $_COOKIE[ ‘woocommerce_recently_viewed_2’ ] , но опять напоминаю, что если вы используете виджет, то этот код вам и вовсе не понадобится.

• is_product() – можно этой функцией проверить, чтобы наш хук срабатывал только на странице товара, только обратите внимание, что это функция WooCommerce и возможно вы захотите на всякий случай добавить проверку function_exists( ‘is_product’ ) , чтобы избежать ошибок 500, когда вдруг будет отключен плагин WooCommerce.
• Посмотрите на строчки 14 и 28 – это как раз то, очём я говорил выше – ID товаров хранятся в куках в виде строки, разделённые символом | , вообще вы можете выбрать любой другой символ, но сам WooCommerce разделяет их так и я решил сделать то же самое.
• Я решил хранить максимум 15 товаров, но вы можете выбрать любое другое максимальное значение, может быть вам будет достаточно 5-и.
• Этот код (и следующий тоже) вставляйте в functions.php вашей текущей темы, либо создайте для него отдельный плагин.

Шаг 2. Шорткод

Я решил создать шорткод [recently_viewed_products] , но вы можете назвать его как угодно по-другому. Кроме того, у меня есть отдельный подробный урок про шорткоды и ещё один про шорткоды WooCommerce.

Впервые познакомился с WordPress в 2009 году. Организатор и спикер на конференциях WordCamp. Преподаватель в школе Нетология.

Если вам нужна помощь с сайтом или разработка с нуля на WordPress / WooCommerce — пишите. Я и моя команда будем рады вам помочь!

Источник