single product php woocommerce
Файлы шаблонов WooСommerce — что за что отвечает
Шаблоны WooCommerce — файлы, которые содержат разметку и структуру шаблонов вашего Интернет-магазина.
Иерархия шаблонов построена таким образом, что можно легко изменять и дополнять шаблоны, да и вообще сразу понятно что где находится и что за что отвечает.
Основные шаблоны:
Шаблоны для работы с корзиной
Шаблоны оформления заказа:
Шаблоны общего назначения
Шаблоны циклов:
Личный кабинет:
Карточка товара:
Шаблоны для работы с заказами:
Папка notices содержит шаблоны сообщений пользователю
Папка emails содержит шаблоны сообщений по электронной почте (шаблоны писем об оформлении заказа, отмене и т.д.)
Как редактировать?
Есть два способа изменения шаблонов
Каждый файл шаблона содержит хуки, с помощью которых вы можете изменять/добавлять или удалять контент без редактирования самих файлов шаблона.
Если вы хотите изменить только один из шаблонов, скопируйте только один необходимый файл и вносите изменения.
Что касается стилей
Но вы можете отключить стили прописав такую строчку в functions.php :
В этом случае отключаться абсолютно все стили WooCommerce
Если нужно отключить определенные таблицы стилей, создайте функцию в functions.php и через нее отключите нужное:
А затем подключите ваши стили
Какие css-стили можно отключить?
Хуки страницы товара в WooCommerce – визуальная карта с примерами редактирования!
Содержание
Каждый владелец или разработчик интернет-магазина на WordPress, пытается подстроить его под свои нужды. В этом руководстве мы будет редактировать страницу товара в WooCommerce. Задача это не тривиальная и есть всего два правильных метода:
Если вы когда-либо работали с кодом WordPress сайта, то наверняка, много раз встречали слово «Хук» или «Зацепка», а если вы разработчик, то использование хуков должно стать вашим основным методом.
Статья о том, как и где выбрать шаблоны для магазина
WordPress шаблоны для интернет магазина на базе WooCommerce: Честный рейтинг 2021
Плагин WooCommerce, как и сам WordPress, имеет огромное количество предопределенных функций. С помощью хуков вы можете кардинально изменить поведение этих функций и заменить существующее значение, тем самым настроив WooCommerce в соответствии с вашими потребностями!
В рамках этого руководства и опираясь на то, что 99% посетители этой страницы являются разработчиками, мы не будет описывать все преимущества работы хуками по сравнению с шаблонами, а будем редактировать страницу товара и рассмотрим все доступные для этой страницы WooCommerce хуки.
Карта хуков страницы товара в WooCommerce
На карте показаны все доступные для редактирования страницы товара хуки. Актуально если у вас WooCommerce версии 4.4+.
Магазин → Майки → Футболка
Название товара ↓
Короткое описание товара ↓
Мужская футболка с логотипом
Красный, Зеленый, Синий
(проверенный владелец) 21.08.2020 ↓
Спасибо огромное, товар отличный! ↓
Возможно Вас также заинтересует… ↓
События, помеченные синим и зеленым цветом можно хукать, а вот помеченные желтым – нет. Но это не значит, что на эти события нельзя повлиять. Их можно переписать, удалить или заменить своими собственными событиями.
В качестве примера давайте выведем дополнительный HTML в woocommerce_single_product_summary :
И в результате получим:
Хуки страницы товара в WooCommerce – добавляем HTML
Хуки страницы товара в WooCommerce – меняем приоритет
Хуки страницы товара в WooCommerce – устанавливаем нулевой приоритет
Двигаемся дальше и давайте рассмотрим все хуки, которые могут пригодится при редактировании страницы товара в WooCommerce.
События (actions) и хуки страницы товара в WooCommerce срабатывающие по умолчанию
Давайте рассмотрим события (actions), которые вы можете отключить или модифицировать используя файл functions.php.
Давайте рассмотрим весь список!
События до начала вывода информации о товаре
В качестве примера, давайте изменим отображение и работу хлебных крошек, сейчас у нас они выглядят так:
Хлебные крошки в WooCommerce – хуки страницы товара в WooCommerce
И чуть-чуть стилизуем добавленный CSS класс wpbl_custom :
В итоге наши хлебные крошки будут выглядеть более презентабельно:
Хуки страницы товара в WooCommerce – модифицируем хлебные крошки
События в левой колонке
Для примера давайте добавим HTML блок под галерею изображений:
Хуки страницы товара в WooCommerce – редактируем вывод изображений
На этом этапе, скорее всего уже понятен принцип работы с хуками в WooCommerce.
Дальше просто перечислим оставшиеся события, а если будет нужно дополним статью примерами.
Правая колонка
События и хуки страницы товара в WooCommerce в правой колонке:
Вот так сейчас у нас выглядит страница товара, давайте посмотрим, что можно сделать с событиями для которых нет хуков (помеченные желтым):
Хуки страницы товара в WooCommerce – работаем с событиями, для которых нет хуков
Допустим мы хотим, чтобы рейтинг товара отображался выше заголовка. В этом случае нам нужно удалить стандартное событие вывода рейтинга, а затем добавить новое, но с другим приоритетом:
Хуки страницы товара в WooCommerce – сортировка событий
Вкладки (tabs) и сопутствующие товары
Как вы уже поняли, можно полностью поменять внешний вид ваших товарных страниц в WooCommerce.
Но, что еще можно сделать с событиями, у которых нет хуков? Ответ простой – сами события можно удалить, а на их место поставить что-то своё!
Вот так сейчас выглядит страница простого товара в нашем экспериментальном WooCommerce магазине:
Страница простого товара в WooCommerce
Давайте кардинально изменим положение блока похожих товаров и изменим их количество:
WooCommerce страница товара – работаем с событиями
Не забудьте прописать стили для мобильных устройств!
События в блоке отзывов и после вывода основного контента
Работа с стольными событиями на странице товара ничем не отличается от вышеописанных методов. Давайте просто перечислим и укажем приоритеты.
Заключение
События и хуки – это классно, это здорово. Благодаря им можно полностью изменить страница товара в WooCommerce не трогая шаблонов. Так же, как вы понимаете, можно удалить все события которые срабатывают по умолчанию и собрать страница с чистого листа, используя свою собственную разметку, функции и логику.
Если у вас есть вопросы – спрашивайте в комментариях.
Woocommerce Multiple single product templates using single-product.php to redirect
I’ve been pulling my hair out with this all day, please forgive the short description, I just need to validate my sanity!!
As the title says, I’m trying to create two or three different single-product layouts within woocommerce. The minimum is trying to achieve would be to have multiple single-product folders each with their own name and configurations.
No matter which way I try to override the single-product.php and make this file use logic to check for the product_cat and give out templates accordingly, I either the page not loading or what I write is skipped over and the default is loaded.
So far I’ve been through the following methods multiple times, trying to piece together what may be outdated code or otherwise causing all the fuss:
I was more hoping someone may know something about this that I’m obviously missing as there are many articles out there on what to try and most claim success but I’m unable to do so.
[Update] using template_include code from @helgatheviking
No success just yet but here’s where I’m up to;
File structure team-shops is the category I’m trying to get
As I said above this isn’t working but hopefully with what I’ve provided the problem may be more obvious.
Thanks again for any help 🙂
Ok so I think I’ve something that works, at least for now it seems to, still have some further testing to do but any thoughts more than welcome, this is what I’ve got so far along with a single-product-team-shops folder in my theme
Woocommerce customize content single product
So I figured finally how to use the woocommerce hooks priorities,
I’m also using a child theme, but I don’t want to just change the priorities of the divs, I want to create my own layout of the single product and echo the price where I want or other stuff.
for example, let’s say this is my code:
I want to echo the price inside the
Can I do that this way? I just don’t see why to use other method, the hooks way seems to me not really organized
3 Answers 3
Then assuming that this is a single product, you can do this in your template’s content-single-product.php :
You can use this in hooks anyway, your choice.
You can use hooks where available, this is a good thing if you want your functionality is sort of independent from the theme, but sometimes you just can’t hook into some actions (because there isn’t any implemented for some of your needs), or you need more control of the layout and all the visual structure, then you can override woocommerce templates in your child theme and do what you want to do.
Check the single-page* templates, maybe that should give you a better idea of what you are looking for.
OK, I got the answer by myself
If you want to customize the content-single-product with any layout that you want, let’s take my example of layout from the question, so you can get rid of the do_action hooks from that page and just insert the functions wherever you want, for example:
Not the answer you’re looking for? Browse other questions tagged woocommerce or ask your own question.
Related
Hot Network Questions
Subscribe to RSS
To subscribe to this RSS feed, copy and paste this URL into your RSS reader.
site design / logo © 2021 Stack Exchange Inc; user contributions licensed under cc by-sa. rev 2021.9.17.40238
By clicking “Accept all cookies”, you agree Stack Exchange can store cookies on your device and disclose information in accordance with our Cookie Policy.
WordPress woocommerce: полностью кастомный вывод и фильрование товаров?
Можно вывести например на сингл странице товара данные полностью по своему? То есть цену, описание, фотки, кнопку заказа и т.п. а не использовать уже имеющиеся шаблоны. Я просто не пойму как это работает.
Могу конечно обычным лупом вывести the_title() и т.п. но как быть с ценой? с кнопкой заказа?
Хорошо, иду на woocommerce документацию, апи почитать, и использую эту функцию к примеру woocommerce_template_single_title() для вывода имени товара, но там уже выводит h1 со стилями, как я понял это можно поменять в single-product/title.php.
Но зачем такие фичи если просто можно сделать get_the_title()? Хорошо, я предполагаю, что конечно, лучше пользоваться уже прикладным апи от плагина и т.п. но как мне все полностью отфильтровать тогда?
Например я хочу полностью поменять экшены и написать свои, но как быть если я не могу найти как реализованы ихние хуки и что идет в ввод и выходит в вывод. Например:
Хочу поменять этот экшн, полностью по своему woocommerce_before_single_product_summary(). Мне нужно все что есть в нем, все данные, которые хочу по своему вывести, но я не знаю какие данные идут туда на вход и с какими данными работает этот экшн. Где можно это увидеть, или почитать, или еще что-то? Помогите разобраться пожалуйста.
В самом шаблоне все уже написано. Вот, например content-single-product.php и интересующий вас экшн.
Здесь написаны все хуки из этого экшна. Их можно удалить, можно всунуть свои экшны с функциями. Каждый легко гуглится и вот здесь официальная документация: https://docs.woocommerce.com/wc-apidocs/index.html
Забиваем в поиск woocommerce_template_single_price и получаем функцию и ссылку на её расположение. Видим
Идем по пути видим код нужного шаблона. Так с каждым интересующим. Каждый шаблон можно скопировать в папку своей темы и изменять как угодно, о чем в файле и написано
Все поля продукта заполнены как кастомные. Можете к ним обращаться через get_post_meta();
Чтоб посмотреть все доступные поля, просто дампните результат этой функции без аргументов на странице товара. Но у продукта вуккомерс есть свои методы типа и т.д. полный список методов здесь