Как использовать хуки для изменения вывода WooCommerce в теме WordPress

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

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

Какие хуки WooCommerce использовать для изменения вывода

Основные хуки для изменения вывода в каталоге и на странице товара:

• woocommerce_before_shop_loop_item — перед карточкой товара;
• woocommerce_after_shop_loop_item — после карточки товара;
• woocommerce_before_single_product_summary — перед описанием товара на странице отдельного товара;
• woocommerce_single_product_summary — основное содержимое описания (цена, заголовок, кнопка и т. д.);
• woocommerce_after_single_product_summary — после описания товара;
• Фильтры типа woocommerce_get_price_html — для изменения формата вывода цены.

Рассмотрим примеры использования.

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

add_action('woocommerce_after_shop_loop_item_title', 'wp_theme_add_custom_text_under_price', 15);
function wp_theme_add_custom_text_under_price() {
    echo '<p class="custom-price-note">Бесплатная доставка при заказе от 5000 ₽</p>';
}

Хук woocommerce_after_shop_loop_item_title позволяет вставить HTML сразу после заголовка и цены товара в каталоге. Приоритет 15 нужен, чтобы выводить после цены (стандартная цена — на 10).

Пример 2: Изменение текста кнопки «Добавить в корзину» на странице товара

add_filter('woocommerce_product_single_add_to_cart_text', 'wp_theme_custom_add_to_cart_text');
function wp_theme_custom_add_to_cart_text() {
    return 'Купить сейчас';
}

Фильтр woocommerce_product_single_add_to_cart_text отвечает за текст кнопки на странице товара. Аналогично можно изменить кнопку в каталоге с помощью woocommerce_product_add_to_cart_text.

Пошаговое решение: как добавить и проверить изменения

1. Создайте дочернюю тему или используйте плагин для пользовательских функций (например, Code Snippets).
2. Добавьте код с хуками в файл functions.php дочерней темы или в плагин.
3. Очистите кэш сайта и браузера, если используете кэширование.
4. Обновите страницу каталога или товара и убедитесь, что изменения появились.
5. Используйте инструменты разработчика браузера (F12) для проверки добавленного HTML и стилей.

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

Чтобы проверить, что хуки работают:

• Откройте страницу каталога или товара и найдите добавленный HTML (например, текст под ценой). Можно искать по CSS-классу, если добавлен в код.
• Проверьте изменения в тексте кнопок «Добавить в корзину».
• Если изменений нет, проверьте, активна ли дочерняя тема, правильно ли подключен код, нет ли ошибок PHP (включите WP_DEBUG).

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

• Код не срабатывает: проверьте, что код добавлен в правильное место (functions.php дочерней темы или плагина), нет ли синтаксических ошибок, включен ли WP_DEBUG для отладки.
• Конфликт с другими плагинами или темой: временно отключите другие плагины и переключитесь на стандартную тему, чтобы проверить совместимость.
• Кэширование: если используется кэш (плагин или сервер), очистите его, иначе изменения не отобразятся.
• Неправильный приоритет хука: измените число приоритета, чтобы вставить контент в нужное место.

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

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

return __('Купить сейчас', 'wp-theme');

• Проверяйте, что функции вызываются только в нужных условиях, например:

if (function_exists('is_product') && is_product()) {
    // код
}

• Минимизируйте HTML, добавляемый через хуки, чтобы не влиять на скорость загрузки.

Сравнение способов кастомизации вывода WooCommerce