WooCommerce: как использовать хуки для динамических изменений структуры страницы товара

Диагностика задачи: почему нужны хуки для изменения страницы товара WooCommerce

Часто стандартная страница товара WooCommerce не подходит под конкретные бизнес-задачи: нужно добавить дополнительный блок, убрать описание, изменить позицию цены или кнопки «В корзину». Правильное использование хуков позволяет изменить структуру страницы без правки шаблонов, что сохраняет совместимость при обновлениях.

Определение нужных хуков на странице товара

Для начала важно понять, какие хуки доступны на странице товара. WooCommerce использует множество do_action и apply_filters на странице single-product. Например:

• woocommerce_before_single_product — перед всей страницей товара
• woocommerce_before_single_product_summary — перед основным блоком с изображением и описанием
• woocommerce_single_product_summary — внутри блока с описанием, ценой и кнопкой
• woocommerce_after_single_product_summary — после основного блока
• woocommerce_after_single_product — в конце страницы

Самые полезные для перестановки элементов — woocommerce_single_product_summary и woocommerce_before_single_product_summary.

Пошаговое решение: добавление и перестановка элементов через хуки

1. Добавление кастомного блока под ценой товара

Допустим, нужно добавить блок с информацией о скидках под ценой товара.

function wpb_custom_discount_notice() {
    echo '<div class="custom-discount-notice">Специальная скидка действует до конца месяца!</div>';
}
add_action('woocommerce_single_product_summary', 'wpb_custom_discount_notice', 25);

Здесь приоритет 25 — после цены (приоритет цены 10), но перед кнопкой «В корзину» (приоритет 30).

2. Перемещение описания товара ниже кнопки «В корзину»

По умолчанию описание выводится с приоритетом 20, а кнопка — 30. Чтобы поменять местами:

remove_action('woocommerce_single_product_summary', 'woocommerce_template_single_excerpt', 20);
add_action('woocommerce_single_product_summary', 'woocommerce_template_single_excerpt', 35);

Это убирает описание с позиции 20 и добавляет его с приоритетом 35, то есть после кнопки.

3. Удаление блока рейтинга товара

Если рейтинг не нужен на странице товара:

remove_action('woocommerce_single_product_summary', 'woocommerce_template_single_rating', 10);

Проверка результата после внедрения

1. Очистите кэш сайта и браузера, если используете кеширующие плагины.
2. Перейдите на страницу любого товара и проверьте, что кастомный блок отображается под ценой.
3. Убедитесь, что описание товара теперь после кнопки «В корзину».
4. Проверьте отсутствие блока рейтинга (если удаляли его).

Для быстрой проверки можно использовать инструменты разработчика браузера (F12) и искать соответствующие классы и HTML-блоки.

Частые ошибки и как их исправить

• Код не работает после добавления в functions.php
  Проверьте, нет ли синтаксических ошибок, правильность приоритетов и что код добавлен в активную тему или дочернюю тему.
• Изменения не отображаются из-за кеша
  Очищайте кеш плагинов (WP Super Cache, W3 Total Cache, LiteSpeed Cache и др.) и браузера.
• Конфликт с другими плагинами, которые тоже меняют хуки
  Временно отключайте плагины, чтобы выявить конфликтующий, или используйте приоритеты в хуках.
• Добавленные блоки ломают верстку
  Проверьте HTML, используйте CSS для стилизации, убедитесь, что классы не конфликтуют.

Практические советы по безопасности и производительности

• Не вставляйте в хуки тяжелые запросы к базе или внешним API — будет падение скорости загрузки.
• Все кастомные функции оборачивайте в проверку, чтобы не вызывать ошибки при отключении WooCommerce:
  

  if ( class_exists('WooCommerce') ) {
      // код
  }

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

Сравнение вариантов изменения страницы товара WooCommerce