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

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

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

Для этого не рекомендуется напрямую править файлы шаблонов плагина, так как при обновлении WooCommerce все изменения будут потеряны. Используйте хуки (actions и filters) — безопасный и гибкий способ кастомизации.

Основные хуки на странице товара WooCommerce

WooCommerce выстраивает страницу товара через набор хуков. Ниже таблица с основными хуками из файла content-single-product.php и связанных:

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

1. Изменение порядка стандартных элементов

В WooCommerce порядок выводимых элементов на хуке woocommerce_single_product_summary задаётся при помощи приоритетов (priority). Пример кода, который переставляет цену выше заголовка:

remove_action('woocommerce_single_product_summary', 'woocommerce_template_single_title', 5);
remove_action('woocommerce_single_product_summary', 'woocommerce_template_single_price', 10);

add_action('woocommerce_single_product_summary', 'woocommerce_template_single_price', 5);
add_action('woocommerce_single_product_summary', 'woocommerce_template_single_title', 10);

Добавьте этот код в functions.php вашей дочерней темы или в кастомный плагин.

2. Добавление кастомного блока с информацией

Допустим, нужно вывести рядом с описанием товара дополнительный произвольный текст или метаполе.

Пример функции вывода:

function wpsetup_custom_product_info() {
    global $product;
    $custom_text = get_post_meta($product->get_id(), '_custom_info', true);
    if ($custom_text) {
        echo '<div class="custom-product-info" style="margin-top:15px; padding:10px; background:#f9f9f9; border:1px solid #ddd;">';
        echo '<strong>Дополнительная информация:</strong> ' . esc_html($custom_text);
        echo '</div>';
    }
}
add_action('woocommerce_single_product_summary', 'wpsetup_custom_product_info', 25);

Для заполнения метаполя _custom_info можно использовать плагин Advanced Custom Fields или добавить вручную через редактор кода.

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

После добавления кода очистите кеш браузера и, если используете кэш-плагины, очистите кэш сайта. Откройте страницу любого товара и убедитесь:

• Порядок элементов на странице изменился (цена выше заголовка)
• Появился кастомный блок с дополнительной информацией, если метаполе заполнено

Для отладки можно временно добавить var_dump() или error_log() в функции, либо включить WP_DEBUG для вывода ошибок.

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

1. Кастомные изменения не применяются

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

2. Ошибки PHP или белый экран

• Синтаксические ошибки в коде — проверяйте через IDE или PHP linter
• Использование функций вне контекста (например, глобальная переменная $product не определена)

3. Кастомный блок не выводится

• Метаполе не заполнено или заполнено некорректно
• Приоритет хуков установлен слишком низкий или высокий, блок выводится вне видимой области

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

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