Как вывести подкатегории wordpress woocommerce

WooCommerce шорткоды для вывода товаров и категорий

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

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

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

Вывод товаров

Последние продукты

Определяет вывод последних добавленных товаров в базу данных WooCommerce.

Рекомендуемые продукты

Функция выводит товары обозначенные как “рекомендуемые” непосредственно в редактировании товарной позиции. Количество продуктов и сортировка определяется аргументами (см. ниже).

Продукт

Отображение одиночного товара по ID или SKU (артикл).

Продукты

Аналогичный принцип вывода товаров, как и в предыдущем примере, только показывает несколько позиций (с сортировкой).

Страница продукта

Полная страница продукта по ID или SKU со всей введенной информацией о нем.

Распродажа продуктов

Вывод товаров со скидкой.

Лидеры продаж

Список товаров, имеющих лучшие продажи по данным заказов в WooCommerce.

Популярные продукты

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

Продукты по атрибуту

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

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

Сопутствующие товары

Вывод товарных категорий

Товарная категория

Вывод одиночной товарной категории по ярлыку (slug).

Товарные категории

Установите аргумент parent в значение 0 для вывода только родительских категорий. Собственный выбор категорий обеспечивается аргументом ids.

Вывод элементов WooCommerce

Корзина товаров

Оформление заказа

Отслеживание заказа

Информация о статусе заказанных товаров.

Личный кабинет

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

Аргументы

1,702 просмотров всего, 1 просмотров сегодня

Источник

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

Как вывести подкатегории wordpress woocommerceПосле интересной заметки о наличии товара в Woocommerce рассмотрю задачу, связанную с подкатегориямии в магазине. Изначально хотел написать более масштабный пост по категориям, но позже решил сузить тему чтобы вас не запутывать. В плагине есть опция с 3-мя способами как можно показывать продукцию в разделах: 1) только товары; 2) подкатегории; 3) совместить оба варианта. В ранних версиях она находилась в меню «Настройки» — «Товары» — «Отображение», позже перенесли в настройщик темы.

Многие используют последний метод дабы посетитель мог самостоятельно выбирать что делать: переходить в нужный архив или сразу просматривать все товары в одном месте. Его и разберем. Разработчикам, кстати, может также пригодиться сниппет позволяющий скрыть категорию и товары из Woocommerce каталога.

К сожалению, в шаблоне WooCommerce для страницы каталога все элементы выводятся «слитно» — и продукция, и разделы размещены в совместном блоке кода.

Как вывести подкатегории wordpress woocommerce

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

Хак вывода подкатегорий WooCommerce

1. Первым делом заходим в раздел «Внешний вид» — «Настройки» — «WooCommerce», где для опции «На странице категории» выбираем показ только самой продукции:

Как вывести подкатегории wordpress woocommerce

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

Как вывести подкатегории wordpress woocommerce

2. Открыв файл archive-product.php в папке wp-content/plugins/woocommerce/templates, увидите как формируется структура страницы архива магазина.

В частности найдете там функцию woocommerce_product_subcategories(), которая производит вывод категорий и подкатегорий WooCommerce перед обработкой непосредственно товаров.

Как вывести подкатегории wordpress woocommerce

Хорошая новость в том, что вы без проблем можете переопределить данную функцию в своем шаблоне, а затем вызывать ее в хуке woocommerce_before_shop_loop.

3. Вам нужно добавить в файл функций (для темы магазина это вероятнее всего custom-function.php) следующие строки:

В данном коде определяется ID объекта из query запроса и осуществляется поиск всех элементов магазина, для которых он является родительским. Дальше в блоке foreach задается как именно вы хотите вывести подкатегории в WooCommerce. Здесь:

Сохраняете файл, загружаете его обратно на FTP и проверяете как все работает.

4. Изначально оформление будет смотреться немного коряво, поэтому вам придется добавить стили (в main-style.css, style.css или другой файл):

Это лишь пример оформления от автора сниппета, изменяйте его как угодно под свою тему. Строки после min-width:768px отвечают за меньшие версии экрана. После внесения правок, смотрите результат. Не забывайте, кстати, следить за правильным размером изображений товара WooCommerce дабы фотки не получались размытыми.

Я тестировал данный пример на реальном сайте — все работает отлично. Возможно, какими-то хитрыми CSS методами получится все реализовать без дополнительной функции либо данная фишка исправлена в новой WooCommerce 3.0 (я тестировал на ветке 2.6.x), но, как бы там ни было, этот пример будет хорошей практикой начинающим WordPress разработчикам.

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

Источник

Как вывести все категории (рубрики) товаров WooCommerce в WordPress?

Я думаю, что многие согласятся со мной, что WooCommerce – это отличное решение для CMS WordPress, с помощью которого можно организовать свой собственный интернет-магазин.

Мы уже затрагивали тему этого дополнения и CMS в общем. Так что сегодня я покажу вам, как просто и без всяких плагинов вывести два вида меню (кликабельный список всех категорий товаров) на вашем сайте.

Одноуровневый вывод всех категорий (рубрик) товаров WooCommerce в любом месте сайта в WordPress

Начнем с самого простого примера – одноуровневого меню со всеми категориями, где есть хотя бы 1 товар.

Вид функции (вставляется в файл functions.php, который находится в папке темы сайта):

Этот код вы вставляете в нужное вам место темы сайта. Важные моменты я пометил в функции.

Основные типы сортировок:

По умолчанию – name.

Допустимые порядки сортировки:

Многоуровневый (древовидный) вывод всех категорий (рубрик) товаров WooCommerce в любом месте сайта в WordPress

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

Вставляете так же в файл functions.php, и использование (вывод):

Вставляете в нужное место в тему вашего сайта. Допустимые настройки вывода – как и в первом варианте.

Стилизацию меню в этой статье я не рассматриваю, думаю, ее вы можете сделать и сами.

Общий класс меню первого уровня – «main_categories_list», второго и последующего – «sub_categories_list» + «sub_categories_list_N», где N – уровень вложения. Цепляетесь за них и настраиваете вид так, как вам нужно.

Источник

Вывод подкатегорий на страницу woocommerce. Полезные снипеты, хитрости, плагины woocommerce

Вывод подкатегорий на страницу woocommerce

Все очень просто: woocommerceнастройкитоварыотображение — На странице категории отображать подкатегории (подкатегории и товары)

Полезные сниппеты для WooCommerce

Так называемые снипетты добавляются посредством добавления кода в файл functions.php в вашем шаблоне.

Добавление валюты
По умолчанию в WooCommerce нет таких валют как русский рубль и украинская гривна. Но это достаточно легко исправить.

Изменение надписи «Главная» в хлебных крошках

Изменение ссылки на главную в хлебных крошках

add_filter( ‘woocommerce_breadcrumb_home_url’, ‘woo_custom_breadrumb_home_url’ );
function woo_custom_breadrumb_home_url() <
return ‘http://elims.pp.ua/?page_id=86’;
>

Выводим ссылку на корзину
Добавляем этот код в то место шаблона, где это нужно. Если нужно в шапке — правим header.php. Это дело можно обернуть в кликабельный div с иконкой корзины.

Вывод какого-либо атрибута товара на странице магазина

И над ней вставляем код:

Без срока действия

Где NameOfYourAttribute — это имя Вашего атрибута. На моем примере я вывожу атрибут который в себе хранит дату окончания акции, то есть до какой даты можно будет купить товар.

Переименование вкладки «Дополнительная информация» в «Характеристики»

Добавить микроразметку рейтинга отзывов на страницу товара:

Если хотите чтобы в сниппете поисковика для страниц товара отображались звезды рейтинга, то для этого нужно использовать микроразметку aggregateRating. Для этого вставьте на странице товара там, где хотите выводить среднее арифметическое по рейтингу, следующий код:

Оборачивание в div изображений в списках товаров

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

add_action( ‘woocommerce_before_shop_loop_item_title’, create_function(», ‘echo «

Источник

Отображение категорий, подкатегорий и товаров отдельными списками в WooCommerce

Дата публикации: 2017-10-03

Как вывести подкатегории wordpress woocommerce

От автора: WooCommerce предлагает несколько вариантов отображения контента на архивных страницах: товары, категории (на главной странице магазина) или подкатегории (на страницах категорий) и товары, и категории. При настройке магазина я обычно выбираю третий вариант – WooCommerce товар списком и категории/подкатегории. Так посетители моего магазина могут выбирать товары прямо с домашней страницы или задать более четкий поиск через архив категорий товаров.

Как вывести подкатегории wordpress woocommerce

Тем не менее, у этого подхода есть один минус: категории/подкатегории отображаются вместе без какого-либо разделения. То есть если у ваших товаров изображения разных размеров, макет страницы будет выглядеть просто ужасно. И даже если изображения одного размера, но хотя бы в одной строке архивной страницы содержатся категории и товары, то кнопка «Добавить в корзину» для категорий сбивает всю верстку. Не все элементы одного размера.

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

Найти в WooCommerce код, отвечающий за вывод категорий и подкатегорий на архивные страницы в виде списка

Как вывести подкатегории wordpress woocommerce

Бесплатный курс «Основы создания тем WordPress»

Изучите курс и узнайте, как создавать мультиязычные темы с нестандартной структурой страниц

Создать плагин для нашего кода

Написать функцию вставки категорий и подкатегорий перед списком товаров

Стилизовать выводимую разметку

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

Что вам понадобится

Для выполнения урока вам потребуется:

Установленный и активированный WooCommerce

Товары – я импортировала шаблонные товары из WooCommerce

Активированная тема, совместимая с WooCommerce – я использую Storefront

Прежде чем приступить: стандартные опции

Давайте взглянем, что дает нам WooCommerce по умолчанию. Я начала с добавления изображений в категории и подкатегории товаров, так как шаблонные данные WooCommerce идут без них. Я просто использовала по одному изображению товаров для каждой категории/подкатегории (см. скриншот ниже):

Как вывести подкатегории wordpress woocommerce

Теперь давайте посмотрим, как WooCommerce отображает категории и подкатегории товаров на архивных страницах. Если еще не перешли, перейдите в WooCommerce > Settings, вкладка products, опция display. Для Shop Page Display и Default Category Display выберите show both:

Как вывести подкатегории wordpress woocommerce

Кликните save changes, чтобы сохранить настройки, и перейдите на страницу магазина. Мой выглядит так:

Как вывести подкатегории wordpress woocommerce

У меня все смотрится хорошо, так как у меня всего 3 категории товаров, а размеры категорий такие же, как у товаров. Но вот так выглядит один из архивов категорий товаров:

Как вывести подкатегории wordpress woocommerce

В этой категории содержится 2 подкатегории, поэтому первый товар расположен с ними на одной строке в сетке из трех элементов по ширине. Я хочу выделить мой категории/подкатегории, просто отделив их от списка товаров. Давайте же приступим.

Находим код WooCommerce, отвечающий за вывод категорий и товаров в архивы

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

Для отображения архивных страниц WooCommerce использует файл archive-product.php в папке templates. В этом файле лежит следующий код, который выводит категории и товары:

Здесь есть функция woocommerce_product_subcategories(), которая выводит категории или подкатегории перед запуском цикла, выводящего товары.

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

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

Обратите внимание: так как WooCommerce очищает стили каждого третьего товара в списке, то мы не сможем использовать функцию woocommerce_product_subcategories() или ее отредактированную версию для отображения категорий. Она будет чистить третью, шестую (и т.д.) категорию или товар в списке, даже при вызове этой функции для раздельного отображения категорий. Ее можно переписать, но проще написать свою функцию. Давайте создадим плагин.

Источник

Добавить комментарий

Ваш адрес email не будет опубликован. Обязательные поля помечены *