# Тема для WooCommerce с блоками для каждого экрана магазина URL: https://canvaswp.com/ru/woocommerce/ Updated: 2026-11-03 WooCommerce Создавайте страницу товара, сетку магазина, корзину и оформление заказа из блоков в редакторе, который даёт WordPress, а затем начните с демо, которое сразу открывается как рабочий магазин. WooCommerce ведёт заказы, а Canvas отвечает за дизайн. Обновлено 3 ноября 2026 г. 24 Блоки WooCommerce 18 Шаблоны магазина 21 Демо-магазины, которые можно импортировать Блоки ## 24 блока для четырёх экранов, которые продают Каждый элемент магазина WooCommerce, который видит покупатель, — это блок с панелью настроек, поэтому его можно переместить, изменить оформление или убрать, не трогая файлы шаблонов. ### Страница товара 11 блоков Соберите макет одного товара блок за блоком или начните с одного из готовых шаблонов и переставьте его части. #### Product Images Included with any plan Выводит главное изображение товара WooCommerce и необязательные миниатюры галереи. #### Product Gallery Linker Included with any plan Полоса миниатюр, которая переводит карусель галереи товара к тому изображению, на которое вы нажали. #### Цена товара Входит в любой тариф Выводит цену товара WooCommerce, включая цену со скидкой и форматирование валюты. #### Product Rating Included with any plan Выводит звёздный рейтинг и, при необходимости, количество отзывов для текущего товара WooCommerce. #### Product Meta Входит в любой тариф Выводит карточку с метаданными товара: SKU, категориями и метками. #### Product Short Description Included with any plan Выводит краткое описание товара с сохранённой разметкой абзацев. #### Образцы вариаций Входит в любой тариф Цветные точки или кнопки-капсулы для выбора вариации вариативного товара. #### Add to Cart Входит в любой тариф Выводит форму добавления в корзину WooCommerce для текущего товара с необязательным полем количества. #### Product Tabs Входит в любой тариф Выводит вкладки данных товара WooCommerce: «Описание», «Дополнительная информация» и «Отзывы». #### Product Share Included with any plan Выводит блок «Поделиться:» со ссылками на соцсети для текущего товара WooCommerce. #### Похожие товары Входит в любой тариф Выводит сетку товаров WooCommerce, связанных с текущим товаром. Отображается только в шаблонах одиночного товара. ### Магазин и каталог: 5 блоков Сетки, карусели, карточки категорий и фильтр по цене, каждый из которых может выводить данные из категории, метки, поиска или вручную заданного списка. #### Товары Входит в любой тариф Выводит товары WooCommerce в виде сетки или списка. Фильтрует по источнику, категории, метке и порядку сортировки. #### Product Categories Included with any plan Выводит категории товаров WooCommerce в виде адаптивной сетки карточек с миниатюрами, названиями и количеством товаров. #### Product Carousel Included with any plan Выводит товары WooCommerce в прокручиваемой карусели owl-carousel. Поддерживает автовоспроизведение, стрелки навигации, точки и адаптивные брейкпоинты. #### Store Price Filter Included with any plan Регулятор диапазона цен с двумя ползунками, который фильтрует сетку товаров прямо на странице. #### Conference Tickets Included with any plan Блоки с ценами для категории билетов, в каждом выбор количества и активная ссылка «Добавить в корзину». ### Корзина: 3 блока Страница корзины, которую вы оформляете, с допродажами, которые покупатели реально видят. #### Cart Table Входит в любой тариф Отображает таблицу корзины WooCommerce с позициями, количеством и итогами. #### Итоги корзины Входит в любой тариф Отображает панель итогов корзины WooCommerce, включая промежуточную сумму, доставку и кнопку оформления заказа. #### Сопутствующие товары Входит в любой тариф Выводит сопутствующие товары из текущей корзины WooCommerce. Отображается только тогда, когда корзина активна и содержит сопутствующие товары. ### 3 блока оформления заказа Форма оплаты, проверка заказа и уведомления, которые сообщают покупателю, что только что произошло. #### Checkout Billing Included with any plan Выводит форму платёжного адреса WooCommerce при оформлении заказа. #### Checkout Order Review Included with any plan Выводит сводку заказа с позициями и итогами на странице оформления WooCommerce. #### WooCommerce Notices Входит в любой тариф Выводит уведомления WooCommerce: ошибки, сообщения об успешном выполнении и информационные уведомления. ### В других разделах магазина 2 блока Блоки магазина, которые не входят в четыре экрана выше. #### Список желаний Входит в любой тариф Товары, которые покупатель сохранил, с ценой, остатком на складе и кнопкой «Добавить в корзину». Разместите его на странице, выбранной в Настройках темы, в разделе «Список желаний». #### Кнопка списка желаний Входит в любой тариф Сохраняет текущий товар в список желаний покупателя. Используйте его в шаблонах товаров и карточках товаров. ### Магазин одежды Каталог модной одежды со страницами коллекций, товарами с вариациями и корзиной в шапке, которая показывает количество товаров. [Темы для e-commerce](https://canvaswp.com/ru/wordpress-themes/ecommerce/) ### Мебель Продажа и аренда в одном каталоге: сетка товаров и страница отдельного товара собраны из блоков. [Темы для дизайна интерьеров](https://canvaswp.com/ru/wordpress-themes/interior-design/) ### Вино Магазин вина, в котором дизайн подчеркивает фотографии продукции, а страницы магазина остаются на заднем плане. [Темы для ресторанов](https://canvaswp.com/ru/wordpress-themes/restaurant/) Три из 21 демо-магазина. Каждая часть, которую покупатель видит на этих страницах, — это блок с панелью настроек. [Все 314 блоков Canvas](https://canvaswp.com/ru/blocks/) Поведение ## Что делают покупатели без перезагрузки страницы Три возможности магазина, каждая из которых обычно требует отдельного плагина, входят в состав интеграции. ### Цветовые образцы атрибутов Задайте цвет для значения атрибута товара в админке, и вариативные товары вместо выпадающего списка будут показывать цветные точки или кнопки-переключатели, чтобы покупатель выбирал вариацию по внешнему виду. ### Добавление в корзину через AJAX Добавление товара из сетки, карусели или оверлея карточки обновляет корзину на месте. Покупатель остаётся на странице, которую просматривал, а мини-корзина в шапке продолжает показывать количество товаров. ### Стили карточек товара Задайте для всех изображений каталога одну форму, чтобы карточки выровнялись, выберите, будут ли дополнительные изображения галереи появляться при наведении или проигрываться как слайд-шоу, и укажите, что предлагает оверлей при наведении: покупку, быстрый просмотр или оба варианта. Шаблоны ## 18 шаблонов магазина в редакторе сайта Каждый экран магазина — это шаблон блоков, который вы открываете, редактируете и сбрасываете в Редакторе сайта так же, как любой другой шаблон блоков. ### Макеты страниц отдельного товара Оформите страницу товара как по умолчанию, с липкой сводкой, которая следует за галереей, в виде списка, с цветовым акцентом, в стиле магазина, в одном из двух макетов галереи с настраиваемыми ссылками или с левой, правой или двойной боковой колонкой. ### Макеты страниц магазина Разместите сам магазин на всю ширину, с левой или правой боковой колонкой, либо с колонками с обеих сторон, чтобы фильтры и категории располагались там, где это нужно вашему каталогу. ### Архивы, корзина и оформление заказа Архив магазина, архивы категорий товаров, корзина и оформление заказа идут отдельными шаблонами вместе с переопределениями шаблонов WooCommerce, которые предоставляет тема. Шаблоны магазина отображаются в группе woocommerce на собственной панели «Шаблоны» в Редакторе сайта, рядом с шаблонами Canvas, и сбрасываются с того же экрана. Назначьте макет для каждого товара в редакторе или задайте значение по умолчанию для всего магазина в Настройках темы. Шаблон, который вы настроили в Редакторе сайта, сохраняется при обновлениях, а Canvas сообщает вам, какие шаблоны изменились после обновления. Настройки темы ## 39 параметров магазина, 5 вкладок Общие значения по умолчанию для каталога, страницы товара, корзины и оформления заказа, а также мини-корзины в шапке, плюс режим каталога для магазинов, которые принимают заявки. Здесь задаются количество товаров на странице, пагинация, форма изображений товара, дополнительные изображения галереи и оверлей карточки. Блок, который задаёт один из этих параметров самостоятельно, всё равно имеет приоритет на той странице, где он размещён. - Каталог: число товаров в ряду на каждом размере экрана, форма изображения, поведение при наведении, значок скидки - Страница товара: что показывает экран отдельного товара и закрепленная панель добавления в корзину - Корзина и оформление заказа: индикатор прогресса бесплатной доставки и оформление заказа без отвлекающих элементов - Мини-корзина: что делает корзина в шапке, когда покупатель добавляет товар - Режим каталога: скрыть цены и кнопку покупки, показать кнопку запроса [Настройки магазина, которые помогают продавать](https://docs.canvaswp.com/store-options-that-help-you-sell) [Режим каталога](https://docs.canvaswp.com/catalog-mode) [Список желаний](https://docs.canvaswp.com/the-wishlist) Настройки темы, раздел «Магазин», вкладка «Каталог». Производительность ## Пять переключателей WooCommerce WooCommerce загружает скрипты и таблицы стилей на каждой странице сайта, в том числе на тех, что ничего не продают. Эти пять переключателей отключают это, и каждый из них можно отменить. - Удаление JavaScript WooCommerce на страницах без вывода магазина - Отключите отслеживание атрибуции заказов, если не читаете эти отчёты - Останавливает опрос скрипта фрагментов корзины при каждой загрузке страницы - Отключите библиотеку проверки надёжности паролей вне страниц аккаунта и оформления заказа - Отключение встроенной библиотеки Select2 вне страниц оформления заказа и личного кабинета [Все 35 оптимизаций производительности](https://canvaswp.com/ru/performance/) «Настройки темы», раздел «Производительность», вкладка WooCommerce. Демо-магазины ## 21 демо — это рабочие магазины WooCommerce Товары, категории, атрибуты, корзина и оформление заказа импортированы и готовы к тестовому заказу. Любой из них можно посмотреть вживую, прежде чем решить. ### [Демо Bag Store, предпросмотр в реальном времени (открывается в новой вкладке)](https://demos.canvaswp.com/ecommerce/) Магазины и e-commerce · 9 страниц · [Что устанавливается: блоки и типы контента демо «Bag Store»](https://docs.canvaswp.com/design-ecommerce) ### [Демо Barber Shop, предпросмотр в реальном времени (открывается в новой вкладке)](https://demos.canvaswp.com/barber/) Красота и спа · 7 страниц · [Что устанавливается: блоки и типы контента демо Barber Shop](https://docs.canvaswp.com/design-barber) ### [Демо CanvasRoam, предпросмотр в реальном времени (открывается в новой вкладке)](https://demos.canvaswp.com/youtube-creator/) Портфолио и личные сайты · 10 страниц · [Что устанавливается: блоки и типы контента демо CanvasRoam](https://docs.canvaswp.com/design-youtube-creator) ### [Демо Christmas Store, предпросмотр в реальном времени (открывается в новой вкладке)](https://demos.canvaswp.com/xmas/) Магазины и e-commerce · 6 страниц ### [Демо Clothing Store, предпросмотр в реальном времени (открывается в новой вкладке)](https://demos.canvaswp.com/store/) Магазины и e-commerce · 19 страниц · [Что устанавливается: блоки и типы контента демо «Clothing Store»](https://docs.canvaswp.com/design-store) ### [Демо Conference, предпросмотр в реальном времени (открывается в новой вкладке)](https://demos.canvaswp.com/conference/) События и свадьбы · 25 страниц · [Что устанавливается: блоки и типы контента демо Conference](https://docs.canvaswp.com/design-conference) ### [Демо Drone, предпросмотр в реальном времени (открывается в новой вкладке)](https://demos.canvaswp.com/drone/) Магазины и e-commerce · 12 страниц ### [Демо eBook, предпросмотр в реальном времени (открывается в новой вкладке)](https://demos.canvaswp.com/ebook/) Магазины и e-commerce · 9 страниц ### [Демо Fashion Shop, предпросмотр в реальном времени (открывается в новой вкладке)](https://demos.canvaswp.com/shop/) Магазины и e-commerce · 25 страниц ### [Демо Fashion Store, предпросмотр в реальном времени (открывается в новой вкладке)](https://demos.canvaswp.com/fashion-store/) Магазины и e-commerce · 16 страниц ### [Демо FORM 2026, предпросмотр в реальном времени (открывается в новой вкладке)](https://demos.canvaswp.com/event-conference/) События и свадьбы · 14 страниц · [Что устанавливается: блоки и типы контента демо FORM 2026](https://docs.canvaswp.com/design-event-conference) ### [Демо Furniture, предпросмотр в реальном времени (открывается в новой вкладке)](https://demos.canvaswp.com/furniture/) Магазины и e-commerce · 12 страниц ### [Демо Game of Canvas, предпросмотр в реальном времени (открывается в новой вкладке)](https://demos.canvaswp.com/gaming/) Развлечения и сообщества · 12 страниц · [Что устанавливается: блоки и типы контента демо Game of Canvas](https://docs.canvaswp.com/design-gaming) ### [Демо Illustrator, предпросмотр в реальном времени (открывается в новой вкладке)](https://demos.canvaswp.com/illustrator/) Портфолио и личные сайты · 7 страниц · [Что устанавливается: блоки и типы контента демо Illustrator](https://docs.canvaswp.com/design-illustrator) ### [Демо Jewelry Boutique, предпросмотр в реальном времени (открывается в новой вкладке)](https://demos.canvaswp.com/jewellery-boutique/) Магазины и e-commerce · 17 страниц ### [Демо Podcasts, предпросмотр в реальном времени (открывается в новой вкладке)](https://demos.canvaswp.com/podcasts/) Блоги и журналы · 13 страниц · [Что устанавливается: блоки и типы контента демо Podcasts](https://docs.canvaswp.com/design-podcasts) ### [Демо Pottery Shop, предпросмотр в реальном времени (открывается в новой вкладке)](https://demos.canvaswp.com/shop-2/) Магазины и e-commerce · 12 страниц ### [Демо Speaker Store, предпросмотр в реальном времени (открывается в новой вкладке)](https://demos.canvaswp.com/speaker/) Магазины и e-commerce · 11 страниц ### [Демо Supplement Store, предпросмотр в реальном времени (открывается в новой вкладке)](https://demos.canvaswp.com/supplements/) Магазины и e-commerce · 13 страниц ### [Демо Wildroot Gear, предпросмотр в реальном времени (открывается в новой вкладке)](https://demos.canvaswp.com/gear/) Магазины и e-commerce · 14 страниц · [Что устанавливается: блоки и типы контента демо «Wildroot Gear»](https://docs.canvaswp.com/design-gear) ### [Демо Wine Estate, предпросмотр в реальном времени (открывается в новой вкладке)](https://demos.canvaswp.com/wine/) Еда и напитки · 10 страниц · [Что он устанавливает: блоки и типы контента демо Wine Estate](https://docs.canvaswp.com/design-wine) [Все 88 демо](https://canvaswp.com/ru/demos/) Импорт на действующий магазин ## Страницы магазина подключаются, а не дублируются Типичный страх при импорте дизайна магазина — получить два оформления заказа. Canvas сопоставляет страницы WooCommerce из демо со страницами, которые уже есть на вашем сайте. Экран импорта, через который загружается любое демо магазина, и откат, который его отменяет. ### Один магазин, одна корзина, одно оформление заказа Импортер находит ваши существующие страницы WooCommerce и сразу направляет на них меню и ссылки демо. ### Обратимо Всё, что создал импорт, отслеживается, поэтому один экран удаляет демо-контент и восстанавливает настройки и меню, которые были раньше. ### Включённые товары Демонстрационные товары, категории, атрибуты и образцы цветов поставляются вместе с дизайном, поэтому каталог выглядит корректно, пока вы заменяете их своими. ### Или только страницы Choose the page-scoped import and you take the demo's pages without its Theme Options, its menus or its front page. Вопросы ## Продажи с Canvas С чего чаще всего начинают владельцы магазинов. Подробно о каждом блоке и параметре рассказывает [документация](https://docs.canvaswp.com/setting-up-your-shop). **Нужен ли по-прежнему плагин WooCommerce?** Да, Canvas добавляет блоки, шаблоны и параметры поверх WooCommerce и ничего в нём не заменяет. Заказы, товары, налоги, доставка и платежи остаются в WooCommerce, где их ожидают ваши другие плагины. Если вы начинаете с демо магазина, мастер настройки установит и активирует WooCommerce перед запуском импорта. **Заменит ли импорт демо магазина мои страницы магазина и оформления заказа?** Нет, импортер Canvas использует уже существующие страницы WooCommerce на вашем сайте, поэтому вторых страниц магазина, корзины, оформления заказа или учётной записи не появляется. Существующие товары и заказы остаются без изменений. **Можно ли сочетать их с собственными блоками WooCommerce?** Да, блоки магазина Canvas являются обычными зарегистрированными блоками, поэтому они работают рядом с блоками WooCommerce и стандартными блоками WordPress в одном шаблоне и на одной странице. Можно заменять их по одному, не переделывая весь макет. **Как работают цветовые переключатели?** Задайте цвет для значения атрибута товара в админке WordPress, и блок Canvas Variation Swatches выведет этот атрибут цветными точками или кнопками вместо выпадающего списка на странице товара и в шаблонах, которые его используют. **Входят ли блоки магазина в ваш тариф?** Да: все 24 блока магазина Canvas относятся к премиум-блокам, и каждый тариф включает все премиум-блоки. Отдельного дополнения для магазина и тарифа eCommerce нет. Другие темы часто продают это отдельно: быстрый просмотр — [функция Astra Pro](https://canvaswp.com/ru/compare/astra/), а OceanWP продаёт [свой плагин eCommerce Pro](https://canvaswp.com/ru/compare/oceanwp/) как отдельный продукт.