Создание и настройка страницы товара в интернет-магазине, созданном на теме Divi WordPress и плагина Woocommerce, возможна 3 способами. Эти способы рассмотрим в статье.
Плагин Woocommerce — самый распространенный инструмент для создания интернет-магазина на сайте WordPress.
Тема Divi для WordPress полностью совместима с плагином Woocommerce. Их вместе можно использовать как инструментарий для создания небольшого интернет-магазина. Далее назовем его «Divi магазин».
Как настроить страницу товара в Divi магазине
Divi магазин дает возможность построить дизайн карточки товара Woocommerce тремя способами:
- Настройка страницы товара классическим редактором (средствами Woocommerce);
- Использование Divi Builder только для описания товара;
- Использование Divi Builder для конструирования всей страницы товара.
И хотя результат от всех способов может выглядеть одинаково (смотрите скрин ниже) — однако возможности у способов различаются.
Степень различия варьируется возможностю доступа к настройкам элементов страницы без кодирования. Ниже рассмотрим эти способы подробнее.
1. Настройка страницы товара классическим способом
Этот способ подразумевает описание товара только средствами плагина Woocommerce, без использования Divi Builder .
Divi магазин при таком способе позволяет настроить только отображение сайдбара на странице и поведение меню при прокрутке страницы.
2. Использование Divi Builder для описания товара
Этим способом можно создавать дизайн описания товара с использованием конструкторв страниц Divi Builder.
Чтобы описывать товар средствами конструктора нужно убедится, что в настройках Divi Bulder разрешено использовать конструктор для построения страницы товара.
Созданный с помощью Divi Builder макет страницы будет размещен на вкладку «Описание».
С помощью конструктора можно размещать во вкладке модули Divi Buider и создавать красивый вид описания товара.
Другие элементы на странице при таком способе недоступны для настройки дизайна без использования кода.
Замечание для Divi версии 3.29+.
Для Divi начиная с версии 3.29 использоваине Divi Builder для страницы товара возможно в 2 вариантах:
— либо для построения описания товара;
— либо для конструирования всей страницы.
При создании нового товара способ устанавливается в настройках Divi Builder.
Значения поля «Product Content» :
«построить с нуля» — использовать Divi Builder для построения всей страницы товара. Этот способ описан ниже;
«по умолчанию» — использовать Divi Builder только для описания товара, которое находится в вкладке «Описание».
Для уже созданных ранее товаров способ можно изменить: в режиме редактировании страницы товара в разделе «Настройка страницы Divi» справа вверху страниц опция Product Content.
Опция «Buid From Scratch» — построение всей страницы товара по макету.
Опция «по умолчанию» — построение только описания товара
3. Использование Divi Builder для конструирования всей страницы товара
В предыдущем разделе я уже писал, что начиная с версии 3.29 в Divi появилсь возможность конструировать всю страницу товара для плагина Woocpmmerce.
Для этого в Divi Buider добавлены новые модули с приставкой «Woo»:
Woo Breadcrumb («хлебные крощки»),
Woo Title (заголовок товара),
Woo Images ( изображение товара),
Woo Gallery (галерея изображений товара ),
Woo Price (Product Price)
Woo Add to cart (кнопка добавить в корзину)
Woo Rating (Оценка товара)
Woo Stock (товарный запас)
Woo Meta (метаданные товара)
Woo Description (описание товара)
Woo Tabs (вкладки товара)
Woo Additional Information (дополнительная информация по товару)
Woo Related Producs («связанные» товары)
Woo Upsells (товары допродажи)
Woo Cart Notice (кнопка просмотр корзины)
Woo Reviews (отзывы на товар)
При выборе построения макета страницы («построить с нуля» или «Build From Scratch») страница нового товара со стороны админпанели будет иметь примерно такой вид :
Использование Woo модулей на обычных страницах и постах
Следует отметить, что модули Divi WooCommerce можно использовать на любой обычной странице или в любой записи на сайте, а не только на страницах товаров WooCommerce.
Например, вы можете добавить и настроить кнопку Woo Add To Cart для определенного товара в магазине на пользовательской целевой странице или записи, которую вы создали для товара.
Для этого надо просто добавить на модуль Woo Add to Cart на страницу как и любой другой модуль Divi.
Заключение
В статье показано, как может происходить настройка страницы товара 3-мя способами в магазине на теме Divi WordPress и Woocommerce.
В комменатриях ниже оставляйте отзывы, задавайте вопросы, делитесь опытом.
Удачи.
Александр Коваль