Что такое блоки WooCommerce? Как их эффективно использовать в 2023 году

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

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

В этом посте мы подробнее рассмотрим блоки WooCommerce и способы доступа к ним в WordPress. Затем мы рассмотрим шесть блоков, которые вы можете добавить в свой магазин, чтобы повысить коэффициент конверсии. Давайте начнем!

Что такое блоки WooCommerce? Краткое введение

WooCommerce — один из самых популярных инструментов электронной коммерции для WordPress. Эта бесплатная платформа с открытым исходным кодом позволяет вам создать интернет-магазин, не вкладывая в него много времени или денег.

Кроме того, WooCommerce поставляется с широким спектром блоков, к которым вы можете получить доступ в собственном редакторе блоков WordPress (также известном как Gutenberg). С помощью этих блоков вы можете перечислить некоторые или все свои продукты, отобразить фильтры продуктов, добавить окно поиска продуктов и многое другое.

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

Вы можете использовать эти блоки WooCommerce так же, как и любой другой блок.

Откройте страницу или публикацию, над которой хотите работать, нажмите на знак плюса (+) и найдите нужный блок:

Добавление новых блоков WooCommerce в редактор блоков

Вы также можете просмотреть полный список доступных блоков WooCommerce, нажав кнопку «плюс» (+) в верхнем левом углу экрана. Под Блоки вкладку, прокрутите вниз до WooCommerce раздел:

Просмотр всех блоков WooCommerce в редакторе блоков

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

Лучшие блоки WooCommerce (и как их использовать)

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

  1. Все продукты блокировать
  2. Продукты с самым высоким рейтингом блокировать
  3. Фильтровать товары по цене блокировать
  4. Поиск продукта блокировать
  5. Все отзывы блокировать
  6. Рекомендуемый продукт блокировать

1. Все продукты блокировать

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

Блок «Все продукты»

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

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

Настройки блока «Все товары»

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

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

Параметр редактирования на панели инструментов «Все продукты»

В предварительном просмотре вы можете редактировать отдельные элементы, такие как изображение, название продукта и кнопку CTA:

Редактирование товаров в блоке All Products

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

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

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

2. Продукты с самым высоким рейтингом блокировать

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

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

Блок «Товары с самым высоким рейтингом»

Рейтинги играют жизненно важную роль в успехе вашего магазина. Они служат для новых посетителей доказательством того, что ваши продукты высокого качества, что может помочь вам увеличить количество конверсий.

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

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

Настройки блока Top Rated Products

Вы также можете скрыть определенные сведения о продуктах, например их цены. Кроме того, вы можете отображать только товары с самым высоким рейтингом в определенной категории, например одежду.

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

Еще одна похожая особенность — Новейшие продукты блокировать. Как следует из названия, это позволяет вам продвигать ваши самые последние дополнения.

3. Фильтровать товары по цене блокировать

Функциональность фильтрации облегчает пользователям поиск того, что они ищут. Это может быть особенно полезно, когда покупатель имеет установленный бюджет.

Фильтровать товары по цене Блок позволяет пользователям определять минимальную и максимальную цену с помощью простого ползунка:

Блок «Фильтрация товаров по цене»

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

Предварительный просмотр блока «Фильтровать продукт по цене»

Фильтровать товары по цене Блок прост в использовании. Однако вы можете еще больше упростить задачу своим пользователям, разрешив им вводить определенные суммы. Для этого выберите блок и перейдите на панель настроек. Под Ценовой диапазонвыберите Редактируемый вариант:

Опция «Редактируемый» в блоке «Фильтровать товары по цене»

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

Блок «Фильтровать товары по атрибуту»

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

Одним из эффективных способов улучшить взаимодействие с пользователем (UX) на вашем сайте является добавление функции поиска. Это позволит пользователям быстро искать любые конкретные предметы, которые они имеют в виду, вместо того, чтобы просматривать ваш каталог, пока они не найдут то, что ищут.

К счастью, WooCommerce предлагает Поиск продукта блокировать:

Блок поиска товаров WooCommerce

Вы можете разместить панель поиска в любом месте вашего сайта. Тем не менее, мы рекомендуем размещать его прямо над сеткой товаров, где пользователи могут легко его увидеть:

Блок поиска товаров над сеткой товаров

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

5. Все отзывы блокировать

Как мы упоминали ранее, отображение обзоров может побудить новых посетителей попробовать ваши продукты. Фактически, одно недавнее исследование показало, что почти все покупатели перед совершением покупки изучают отзывы клиентов (1).

Как следует из названия, Все отзывы Блок позволяет отображать все отзывы клиентов в одном месте:

Блок «Все отзывы» WooCommerce

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

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

Есть несколько способов показать свои отзывы. Например, вы можете разместить их на своей домашней странице, чтобы увеличить их видимость, или снова добавить их на свою страницу «О нас».

Вы также можете объединить Все отзывы блок с двумя другими связанными функциями: Отзывы по продукту и Отзывы по категориям. Эти блоки позволяют отображать рейтинги и отзывы клиентов для определенных товаров и категорий.

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

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

Добавление блока Featured Product

Затем вы можете настроить макет вашего рекомендуемого продукта:

Настройки блока Featured Product

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

Кроме того, вы можете редактировать кнопку CTA внутри блока. Все, что вам нужно сделать, это нажать на нее, и вы получите выбор вариантов. Например, вы можете обновить ссылку и настроить цвет и типографику кнопки:

Редактирование CTA в блоке Featured Product

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

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

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

Начните работать с блоками WooCommerce уже сегодня

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

В этом посте мы рассмотрели некоторые из наиболее важных блоков WooCommerce. Например, Все продукты Блок позволяет отображать весь каталог товаров в профессиональной сетке. При этом такие функции, как Продукты с самым высоким рейтингом и Все отзывы может помочь вам увеличить продажи.

У вас есть вопросы об использовании блоков WooCommerce? Дайте нам знать в комментариях ниже!

Бесплатное руководство

4 основных шага к ускорению
Ваш сайт WordPress

Следуйте простым шагам из нашей мини-серии из 4 частей.
и сократить время загрузки на 50-80%. 🚀

Похожие записи

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

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