как узнать id товара woocommerce
Шорткоды в WooCommerce. Часть 1
Здравствуйте, друзья! Сегодня мы поговорим о шорткодах интернет магазина WooCommerce. В этом уроке достаточно много нового и полезного могут найти те, кто не так давно создал интернет магазин с помощью плагина WooCommerce и еще не знают всех возможностей плагина.
В WooCommerce по умолчанию и без каких-либо плагинов можно использовать встроенные шорткоды. Вставляя шорткоды на страницы или записи, Вы можете вывести списки популярных, новых или акционных (со скидкой) товаров, категории и т.п. И так, давайте начнем!
Как вывести последние добавленные (новые) товары?
Данный шорткод часто используют на главной странице для того, чтобы посетители видели новинки в ассортименте магазина:
Шорткод выводит 12 последних добавленных товаров в 4 колонки. Для того чтобы изменить количество товаров нужно всего лишь установить нужное цифровое значение в recent_products per_page. Аналогично и с количеством колонок.
Как вывести популярные товары?
Для этого используйте шорткод:
Этот шорткод работает точно так же, как и предыдущий, но отображает те товары, которые были отмечены звездочками «Рекомендуемый» в списке товаров:
Вывод одного товара по ID или артикулу (SKU)
Для того, чтобы сделать вывод одного нужного Вам товара по ID используйте шорткод:
ID (идентификатор товара) можно узнать при наведении на товар в списке товаров:
Для вывода товара по артикулу используйте:
Где узнать артикул товара писать не буду. Уверен, что если он у Вас есть, то вы точно знаете 😉
Как сделать вывод нескольких товаров по ID или артикулу (SKU)
При желании можно сделать вывод товаров по идентификатору (ID), для этого используйте шорткод:
Через запятую нужно указывать ID товаров которые Вы хотите вывести.
Вывести товары можно и с помощью артикулов. Для этого используйте шорткод ниже, в котором через запятую укажите артикулы нужных товаров:
По умолчанию товары будут отображаться в 4 колонки.
Кнопка «Добавить в корзину» для определенного товара
Еще один интересный шорткод. Он создает кнопку на которой отображается только цена указанного (по ID) товара и надпись «Добавить в корзину».
Об остальных не менее полезных и интересных шорткодах читайте в следующей части урока.
WordPress.org
Русский
id товара
в теме к товарам привязаны айди, вопрос: как их узнать?
Страница, с которой нужна помощь: [войдите, чтобы увидеть ссылку]
в теме к товарам привязаны айди,
«В теме» ничего не привязано. «Привязано» в базе.
Обычно в адресе строке при редактировании. Можно также использовать плагины. Но что такое «товары» в Вашем случае — известно только Вам. В ВП из коробки этого нет.
тема electro, например есть блок популярные товары, в консоли в этот блок идут товары, айди которых надо прописать, вот и непонятно откуда их брать.
http://best-leggins.ru/losiny/wireless-audio-system-multiroom-360
вот это называется товар.
как узнать id — написал коллега выше.
в админке достаточно просто навести на товар. без всяких плагинов.
в админке достаточно просто навести на товар. без всяких плагинов.
Чтобы увидеть — да. Но это очень неудобно если его (их) ID нужно скопировать. Я сталкивался с ситуацией, когда в шорткод нужно было прописать от 5 до 25 ID. Решения, лучшего чем этот плагин я не нашел. Да его (лучшего) наверное и нет.
Чтобы увидеть — да. Но это очень неудобно если его (их) ID нужно скопировать
чем более юзерфрендли сделают интерфейс, тем более ленивый появиться юзверь
Таких — валом 🙂
Но есть плагины для более удобной настройки. Напр https://wordpress.org/plugins/codepress-admin-columns/ Без него я уже и не представляю себе работу при разработке сайтов.
Правда, уже поднадоело на каждом сайте всё заново настраивать (а экспорт настроек в платной версии ;)) и уже подумываю написать свое, со всем нужными мне колонками.
чем более юзерфрендли сделают интерфейс, тем более ленивый появиться юзверь
Вы и наверное и пультом от ТВ (и тп) не пользуетесь? :).
Не очень любимая мною фраза «лень — двигатель прогресса», но тут как нельзя подходит.
«Машина должна работать, а человек думать».
Вы и наверное и пультом от ТВ (и тп) не пользуетесь? :).
Шорткоды для интернет магазина на WordPress + WooCommerce
Приветствую, тебя дорогой читатель! В придыдущей статье мы разбирались что такое шорткод для WordPress, где они используются, ну и конечно же примеры шорт кодов для WordPress. В этой статье мы поговорим о шорткодах для интернет магазина на базе WooCommerce.
В WooCommerce по умолчанию существуют базовые шорткоды при помощи которых можно выводить ту или иную информацию. Не будем ходить вокруг да около, а перейдем к непосредственым примерам
Выводим последние добавленные товары (новые товары)
Этот шорткод будет полезен к примеру на главной странице сайта для того, чтобы показать покупателю новые товары из ассортимента магазина:
Теги шорткода:
Изменяя значение per_pag вы можете регулировать количество выводимых товаров, а columns отвечает за количество колонок
Результат:
Выводим популярные товары
Теги шорткода:
Вывод одного товара по ID или артикулу (SKU)
В случае если нужно вывести один конкретный товар это можно сделать при помощи шорткода с указанием ID нужного вам товара
Теги шорткода:
узнать ID (идентификатор товара) товар можно на странице всех товаров, в списке товаров просто наведите курсором мыши на нужный вам товар:
Так же можно вывести нужный вам товар по артикулу для этого то же существует шорткод
Теги шорткода:
Вывод нескольких товаров по ID или артикулу (SKU)
Теги шорткода:
Такая же кострукция может быть применена и для вывода товара по артикулу. Как и в предыдущем примере артикулы нужных вам товаров перечисляются через запятую
Теги шорткода:
По умолчанию товары будут выводиться в четыре колонки.
Вывод кнопки «Добавить в корзину» для определенного товара
Этот шорткод создаст кнопку на которой будет отображается цена указанного (по ID) товара и надпись «Добавить в корзину».
Теги шорткода:
Результат:
Выводим страницу товара на любой странице
Шорткод при помощи которого осуществляется вывод страницы по ID товара или артикулу на любой выбранной вами странице или записи.
Теги шорткода вывод по ID товара:
Теги шорткода вывод по артикулу:
Результат:
Вывод товаров из категории WooCommerce
Для вывода всех товаров из определенной категории WooCommerce примените следующий шорткод:
Теги шорткода:
Вывод картинки ярлыка категории
Теги шорткода:
Значение number — регулирует количество выводимых категорий.
Вывести конкретные категории можно при помощи указания их ID в шорткоде
Теги шорткода:
Результат:
Вывод товаров со скидкой
Теги шорткода:
Результат:
Вывод топа рейтинговых товаров
Рейтинги товару назначаются при добавление комментариев. На основе этих рейтингов можно сделать вывод рейтинговых товаров.
Теги шорткода:
Вывод товаров по свойствам
В данном примере мы выведем товары со свойством Цвет, в которых указан цвет товара черный.
Теги шорткода:
Вывод страницы корзины
Теги шорткода:
Вывод страницы оформления заказа
Теги шорткода:
Вывод страницы отслеживания заказа
Теги шорткода:
Вывод последних заказов пользователя и учетных записей пользователя
Теги шорткода:
Если у Вас возникнут вопросы — смело задавайте их в комментариях
WooCommerce: шорткоды — примеры использования
Статья также дополнена другими примерами из практики студии.
Как использовать шорткоды
Шорткоды можно вставлять в страницы, посты и описания товаров.
Страницы
[woocommerce_cart] – страница корзины
[woocommerce_checkout] – страницу оформления заказа
[woocommerce_my_account] – личный кабинет
[woocommerce_order_tracking] – страница отслеживания заказа
Товары
[products] — шорткод выводит товары. С помощью атрибутов можно выводить товары по идентификатору ID, артикулу SKU, категориям, характеристикам и меткам. Можно разбивать список товаров на страницы и настраивать сортировку.
Список атрибутов [products]
Примеры использования [products]
Товары со скидкой
Шорткод выводит 4 товара со скидкой в 4 столбца, отсортированных по популярности.
Также добавлен собственный ccs-класс «quick-sale», чтобы выделить товары с помощью серого фона и отступов.
Рекомендуемые товары
Шорткод выводит 6 рекомендуемых ★ товаров в 3 столбца. По умолчанию используется сортировка по названию (от А до Я), хоть это и не указано явно.
Самые продаваемые товары
Шорткод выводит 3 самых часто покупаемых товара. По-умолчанию товары выводятся в 3 столбца, хоть это и не указано явно.
Новинки
Шорткод выводит последние добавленные товары — 4 в одном ряду. Для этого мы будем использовать идентификатор ID (который генерируется при создании страницы товара), а также команды order и orderby.
Новые поступления
Если нужно вывести старые товары, как новинки, например если они недавно поступили на склад и их нужно показать в отдельном блоке. Для этого нужно обновить дату публикации у товаров. А в шорткоде указать способ сортировки — по дате.
Товары отдельных категорий
Товары с определёнными характеристиками
Шорткод выводит товары красного цвета, отсортированных по дате: сначала новые, потом старые.
Товары с меткой, тегом
Шорткод выводит все товары с меткой «Худи»
Сортировка по пользовательским полям
С помощью шорткодов выше можно сортировать только по ID, наименованию товара, дате добавления, порядковому номеру, популярности, рейтингу или в случайном порядке.
Для сортировки по другим полям потребуется расширить шорткоды сортировки. Для этого разработчики WooCommerce рекомендуют код ниже. Код работает, но на некоторых темах после него перестают работать шорткоды, в которых сортировка не указана. Вобщем нужно тестировать.
Категории
Для вывода категорий используется два шорткода:
[product_category] — выводит товары
[product_categories] — выводит категории
Список атрибутов категорий
Примеры использования [product_category]
Шорткод выводит только категории верхнего уровня.
Страница товара
Шорткод выводит страницу одного товара по ID или артикулу.
Сопутствующие товары
Шорткод выводит сопутствующие товары.
Добавить в корзину
add_to_cart — шорткод добавляет товар в корзину по ID.
Кнопка «Добавить в корзину»
Шорткод выводит кнопку добавления товара в корзину. При нажатии на кнопку товар с добавится в корзину в количестве 3 штук.
style=»border:0; padding: 0; text-align:right;» — скрывает рамку, убирает внешний отступ у кнопки и выравнивает её по правому краю.
show_price=»0″ — атрибут показывает или скрывает цену. По умолчанию зачение 1 показывает цену.
quantity=»3″ — количество товара.
Ссылка «Добавить в корзину»
Уведомления
Хоть этот шорткод и указан в документации WooCommerce — мне не удалось проверить его работу. Шорткод [shop_messages] у меня не работает.
Шорткоды WooCommerce на примерах
Шорткоды WooCommerce могут быть знакомы не всем. Даже если у вас есть магазин WooCommerce, это может быть функция, с которой вы еще не сталкивались и не осознаете, насколько они могут быть полезны.
Шорткоды WooCommerce — это небольшие фрагменты кода, которые вы можете разместить в любом месте вашего сайта для отображения товаров WooCommerce или призывов к действию, таких как кнопки «Купить сейчас». Существует множество способов их использования, и они должны работать в рамках любой темы с установленной WooCommerce.
Шорткоды WooCommerce — добавить товары на главную страницу
Первое очевидное место, где шорткоды WooCommerce пригодятся, — это ваша домашняя страница. Это идеальное место для отображения динамически обновляемой сетки ваших последних продуктов. После того, как шорткод был добавлен, вам не нужно редактировать его снова. Он будет автоматически отображать самые последние продукты, придавая вашей домашней странице свежий новый вид каждый раз, когда вы добавляете новые товары в свой магазин.
Вот шорткод WooCommerce, который можно использовать на главной странице для отображения последних дополнений:
Просто заходим на нужную страницу, выбираем «Шорткод», как на изображении ниже
И добавляем нужный шорткод
Что означает каждый атрибут:
Этот шорткод WooCommerce приводит к аккуратной сетке из 8 продуктов, разделенных на 4 столбца.
Отображение самых популярных продуктов с помощью шорткодов WooCommerce
Точно так же, как вы можете показать самые последние товары, вы можете показать свои самые продаваемые продукты. Все динамично обновляется и отлично подходит для показа сезонных популярных идей подарков.
Для этого вы можете использовать следующий шорткод WooCommerce:
Создание сетки товаров, поступающих в продажу
Далее мы создадим совершенно новую страницу и назовем ее «Мужские товары для продажи» – в ней будут перечислены исключительно товары для продажи с категорией для мужчин. Мы хотим, чтобы эта страница автоматически заполнялась каждым товаром по сниженной цене в категории «мужчины» в WooCommerce.
Для этого я использую этот шорткод WooCommerce.
У меня не так много продуктов в этой категории, поэтому лимита в 100 больше, чем достаточно, и охватывает любые дополнительные товары, добавленные позже. Ключевыми дополнительными переменными являются on_sale= «true» и category= «men», в которых перечислены только предметы продажи в рамках вышеупомянутой категории. Опуская конкретное имя селектора категорий, вы просто отобразите все товары продажи среди каждой категории.
Шорткоды WooCommerce — как отобразить шаблон списка категории
Кроме того, можно не просто отображать продукты с помощью шорт-кодов WooCommerce. Вы также можете показать категории. Если вы хотите создать страницу для перечисления всех категорий ваших продуктов, это очень просто. Просто используйте этот шорткод WooCommerce:
Он будет отображать все ваши категории, и результат будет выглядеть как скриншот ниже, если вы добавили миниатюру категории к каждой из них.
Но что делать, если вы хотите показать только определенные категории?
Для этого можно использовать другой шорткод. Это та же базовая структура, что и другие шорткоды в WooCommerce. Вы перечисляете идентификаторы категорий, разделенные запятыми.
Как узнать, какие идентификаторы есть у моих категорий?
Вам нужно перейти в раздел: Товары> категории > и нажать кнопку в категории. Вы увидите идентификатор в url-адресе Вашего браузера. Например, tag_ID=95, поэтому 95 — это идентификатор категории.
Как включить конкретные продукты в пост блога с помощью шорткода
Один из аспектов, который часто упускается из виду, заключается в том, что WordPress — это в основном превосходная платформа для ведения блогов. Многие магазины электронной коммерции совершают ошибку, не публикуя достаточно часто или даже не имея четко определенной стратегии контента в первую очередь. Это не тема данной статьи, но благодаря шорткодам можно быстро и легко добавить прямые действия покупки к продуктам, упомянутым в блоге.
Возьмем любую статью в качестве примера – скажем, что в ней упоминаются три обязательные куртки, которые нужно купить в этом сезоне.
Первый шаг-найти уникальный идентификатор каждого продукта. Вы можете сделать это, перейдя в раздел Товары и наведя курсор мыши на соответствующий элемент.
Вы можете видеть в приведенном выше примере, что идентификатор этого конкретного продукта равен 677. Сделайте то же самое еще для двух продуктов и запишите идентификаторы для каждого из них.
Теперь просто создадим новый фрагмент кода, основанный на предыдущем примере, но явно ссылающийся на эти три идентификатора продукта.
Вы увидите, что три числа разделены запятыми. Они будут отображаться в указанном вами порядке. Я использую столбцы= «3», так как в списке есть три идентификатора. Если бы я показывала четыре элемента, я бы изменила это на столбцы= «4».
Добавление только одного продукта в сообщение блога (включая пользовательский CSS)
Если мы хотим добавить только один продукт в пост, он будет занимать всю ширину контента – что будет выглядеть немного странно. Можно переместить его вправо и позволить тексту обтекать его.
Шорткод WooCommerce, содержащий только один продукт, выглядит так:
А теперь несколько пользовательских CSS, которые вы можете добавить во: Внешний вид > настройка > дополнительный CSS или в дочернюю тему. Обратите внимание на наличие медиа-запроса, который означает, что стиль включается на экранах более 768px. Таким образом, на меньших экранах продукт будет иметь полную ширину.
Использование шорткода WooCommerce add to cart
Если вы не хотите отображать весь продукт, есть способ просто отобразить кнопку «купить».
Вы снова просто меняете идентификатор для продукта, который хотите отобразить.
Как создать страницу отслеживания заказов с помощью шорткода WooCommerce
Одна страница, которая не добавляется по умолчанию в WooCommerce, — это страница отслеживания заказов. Вам нужно будет создать ее самостоятельно, используя шорткод WooCommerce.
Вы можете сделать это, создав новую страницу под названием «отслеживание заказов» и добавив новый блок шорткода к содержимому:
Результат будет выглядеть так:
Что такое шорткод корзины WooCommerce?
Когда вы устанавливаете WooCommerce, вы получаете пару страниц, созданных для вас автоматически. Это страницы «корзина», » чек » и «мой аккаунт». Возможно, вы знаете, что они также используют шорткоды WooCommerce. Это все, что нужно, чтобы построить эти страницы.
Шорткод корзины WooCommerce:
Больше информации можно найти на официальном сайте woocommerce https://docs.woocommerce.com/document/woocommerce-shortcodes/
В этой статье можно ознакомиться с применением шорткодов при создании дочерней темы Woocommerce, здесь шоркод добавляется прямо в код.
Когда мы создаем свою тему, в файле functions.php мы регистрируем Read more
Стандартная страница входа на сайт wordPress выглядит не очень привлекательно. Read more
В одной из статей мы добавили баннер на главную страницу Read more
В одной из статей мы создали записи блога и добавили Read more
После того, как мы внесли изменения на страницу корзины, пришло Read more
Зная, как пользоваться action hook и filter hook можно с Read more