Руководство для продвинутых пользователей: как настроить свой интернет-магазин с помощью хуков и фильтров WooCommerce.

Хуки и фильтры WooCommerce: функции и различия.

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

HooksХуки — это интерфейс, предоставляемый WooCommerce для выполнения определённых этапов жизненного цикла, который позволяет вам “подключить” свой код для выполнения новых действий или функций. Хуки делятся на два типа:Actions(Действие) иFilters(Фильтры). Проще говоря, хуки действий используются для “выполнения определённых действий”, они не возвращают никаких значений, а просто предоставляют возможность выполнить ваш пользовательский код в определённый момент. Например, добавление баннера после загрузки страницы корзины покупок. Хуки фильтров используются для “изменения чего-либо”, они получают значение, позволяющее вам изменить это значение, после чего вы должны вернуть изменённое значение. Например, изменение формата отображения цены товара.

FiltersФильтры — это тип хуков, но из-за их специфической семантики “изменить и вернуть” их часто упоминают вместе с действительными хуками. Распространенное заблуждение заключается в том, что если пытаться вернуть значение с помощью действительного хука, это приведет к сбою кода. Четкое определение ваших потребностей — “выполнять действия” или “изменять данные” — является первым шагом в выборе правильного инструмента.

Рекомендуемое чтение Углублённое изучение хуков и фильтров ядра WordPress: от основ до практического программирования.。

Основной интерфейс хуков и фильтров.

Использование хуков и фильтров в основном зависит от нескольких основных функций, предоставляемых WordPress. Владение этими функциями является основой для любой настройки.

Ультахост (UltaHost) – хостинг-провайдер, предоставляющий услуги хостинга для сайтов, построенных на платформе WordPress.

Гарантия возврата средств в течение 30 дней, неограниченная пропускная способность интернет-канала и объем баз данных, бесплатная защита от DDoS-атак. При покупке на срок 3 лет предоставляется скидка в размере 501 ТБ до 4 ТБ.

страница доступа

Основная функция хука действий.

Наиболее часто используемыми функциями являются…add_action()Эта функция используется для “подписки” вашей пользовательской функции на заданный хук действия. Её базовая синтаксис включает название хука, обратный вызов, приоритет и количество принимаемых параметров. Приоритет определяет порядок выполнения, когда несколько функций подключены к одному и тому же хуку; чем меньше число, тем выше приоритет.

add_action(‘woocommerce_before_add_to_cart_button’, ‘my_custom_message’, 10, 0 );
function my_custom_message() {
    echo ‘<p>Перед покупкой, пожалуйста, проверьте технические характеристики!</p>’;
}

Вышеуказанный код выводит на экран пользовательское уведомление перед кнопкой “Добавить в корзину”.

Основная функция фильтра-хука.

Соответственно, для изменения данных необходимо использоватьadd_filter()Функция. Её структура аналогична структуреadd_action()Это похоже, но ваша функция обратного вызова должна принимать входное значение и возвращать другое значение.

add_filter( ‘woocommerce_currency_symbol’, ‘change_currency_symbol’, 10, 2 );
function change_currency_symbol( $currency_symbol, $currency ) {
    if ( $currency == ‘USD’ ) {
        $currency_symbol = ‘US$’;
    }
    return $currency_symbol;
}

В этом примере символ доллара изменится с “$” на “US$”.

Рекомендуемое чтение Повышение конверсии в электронной коммерции: подробный анализ стратегии оптимизации страниц товаров в WooCommerce.。

Практический пример: настраиваемая страница продукта.

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

Добавьте контент перед разделом “Добавить в корзину”.

woocommerce_before_add_to_cart_formиwoocommerce_before_add_to_cart_buttonЭто два часто используемых хука. Первый запускается перед всей формой и подходит для добавления баннеров или предупреждающих блоков; второй запускается между полем для ввода количества и кнопкой и подходит для добавления кратких объяснений или чекбоксов.

add_action( ‘woocommerce_before_add_to_cart_button’, ‘add_product_notes_field’ );
function add_product_notes_field() {
    echo ‘<div class="“product-notes”"><label>Требования к индивидуальному заказу:</label><textarea name="“customer_notes”"></textarea></div>’;
}

Изменить вывод сводки продукта.

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

hosting.com Общий хостинг

Высокая производительность благодаря процессорам AMD EPYC, SSD-накопителям NVMe и LiteSpeed, круглосуточная экспертная поддержка, передовые меры безопасности, включая SSL, защиту от грубой силы, вредоносных программ и DDoS, экономия до 73%

страница доступа

add_filter( ‘woocommerce_short_description’, ‘append_to_short_description’ );
function append_to_short_description( $desc ) {
    $desc . = ‘<p><em>Этот продукт поддерживает 7 дней возврата без причины.</em></p>’;.
    return $desc.
}

Пример из практики: настраиваемая корзина покупок и процесс оформления заказа.

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

Добавить глобальную информацию после формы корзины покупок.

woocommerce_after_cart_tableХуки позволяют добавлять контент после списка товаров в корзине и перед обзором корзины, например, подсказку о промокоде или информацию о предварительной стоимости доставки.

add_action( ‘woocommerce_after_cart_table’, ‘add_cart_promotion_notice’ );
function add_cart_promotion_notice() {
    echo ‘<div class="“cart-promotion”">Бесплатная доставка при заказе на сумму свыше 500 юаней!</div>’;
}

Изменить поле расчёта.

Система полей для оформления заказа в WooCommerce очень настраиваемая и широко использует фильтры. Например, чтобы изменить тег и заполнители поля “Адрес 2”, можно воспользоваться следующим кодом:woocommerce_default_address_fieldsИли более конкретно…woocommerce_billing_fieldsФильтр.

Рекомендуемое чтение Учебник по WooCommerce: создание мощного сайта электронной коммерции WordPress с нуля!。

add_filter( ‘woocommerce_default_address_fields’, ‘modify_address_2_field’ );
function modify_address_2_field( $fields ) {
    if ( isset( $fields[‘address_2’] ) ) {
        $fields[‘address_2’][‘label’] = ‘公寓、套房、单元等（可选）’;
        $fields[‘address_2’][‘placeholder’] = ‘可不填’;
    }
    return $fields;
}

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

резюме

Настройка с помощью хуков и фильтров WooCommerce позволяет глубоко персонализировать каждую деталь вашего интернет-магазина без изменения основного кода. Начните с понимания принципиальной разницы между действиями и фильтрами, а затем освойтеadd_action()иadd_filter()Затем, применяя эти два основных функционала в таких ключевых областях, как страница продукта, корзина покупок и процесс оформления заказа, вы сможете постепенно создавать высоко персонализированный и функциональный интернет-магазин. Помните, что всегда следует добавлять пользовательский код в подтемы.functions.phpЭто можно сделать либо в самом файле, либо с помощью пользовательских плагинов, и это является лучшей практикой для обеспечения безопасности обновлений.

Общий хостинг InterServer

Общий хостинг $2.50 USD в месяц, первый месяц $0.1 USD промо-код tryinterserver, 461 скрипт облачных приложений, установка в один клик.

страница доступа

Часто задаваемые вопросы

### Где мне следует разместить свой пользовательский код?
Самый безопасный и рекомендуемый способ — разместить их в подтеме той темы, которую вы используете в данный момент.functions.phpВ файле.

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

Как найти конкретный хук или фильтр, который мне нужен?

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

Кроме того, в редакторе кода в административной панели WordPress или с помощью такого плагина, как “Simply Show Hooks”, можно наглядно отобразить все доступные хуки на странице, что очень удобно для их быстрого поиска.

Я использовал хуки, но код не работает. Как это проверить?

Во-первых, проверьте, нет ли в вашем коде синтаксических ошибок, которые могут привести к неудачному анализу PHP. Убедитесь, что обратные вызовы определены правильно, иadd_actionилиadd_filterПриоритеты и количество параметров указаны правильно.

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

Какая разница между изменением файлов шаблона WooCommerce и использованием хуков?

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

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