Как добавить динамические поля в WooCommerce: практическое руководство

Автор: Павел Титов | Опубликовано: 15.02.2026

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

Почему нужны динамические поля в WooCommerce

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

Добавить опции с зависимостями (различные варианты цвета и размера с динамическими ценами);
Собирать дополнительную информацию от покупателей (например, персонализация, гравировка, пожелания);
Добавлять поля, которые появляются только при определенных условиях;
Управлять дополнительными атрибутами товара в админке и на фронтенде.

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

Основные способы добавления динамических полей в WooCommerce

1. Использование плагинов для динамических полей

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

Advanced Custom Fields (ACF) – универсальный плагин для добавления любых пользовательских полей, поддерживает условный вывод и интеграцию с WooCommerce.
WooCommerce Product Add-Ons – плагин для добавления дополнительных опций к товарам, включая текстовые поля, селекты, чекбоксы.
WPSHOP Custom Fields Pro – плагин с расширенными возможностями для создания динамических полей, идеально подходит для магазинов с нестандартными требованиями (подробнее на wpshop.ru).

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

2. Добавление динамических полей через код в functions.php

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

Добавим поле «Персональная гравировка», которое будет отображаться только если выбран определенный товар:

add_action('woocommerce_before_add_to_cart_button', 'wpfactory_add_custom_field');
function wpfactory_add_custom_field() {
    global $product;
    $target_id = 123; // ID товара, для которого нужно поле
    if ($product->get_id() === $target_id) {
        echo '<p class="form-field">
            <label for="wpfactory_custom_text">Персональная гравировка</label>
            <input type="text" id="wpfactory_custom_text" name="wpfactory_custom_text" value="" />
        </p>';
    }
}

add_filter('woocommerce_add_cart_item_data', 'wpfactory_save_custom_field', 10, 2);
function wpfactory_save_custom_field($cart_item_data, $product_id) {
    if (isset($_POST['wpfactory_custom_text']) && !empty($_POST['wpfactory_custom_text'])) {
        $cart_item_data['wpfactory_custom_text'] = sanitize_text_field($_POST['wpfactory_custom_text']);
        $cart_item_data['unique_key'] = md5(microtime().rand()); // чтобы товары с разными полями не объединялись
    }
    return $cart_item_data;
}

add_filter('woocommerce_get_item_data', 'wpfactory_display_custom_field_cart', 10, 2);
function wpfactory_display_custom_field_cart($item_data, $cart_item) {
    if (isset($cart_item['wpfactory_custom_text'])) {
        $item_data[] = array(
            'key' => 'Гравировка',
            'value' => wc_clean($cart_item['wpfactory_custom_text'])
        );
    }
    return $item_data;
}

add_action('woocommerce_add_order_item_meta', 'wpfactory_add_custom_field_order_meta', 10, 2);
function wpfactory_add_custom_field_order_meta($item_id, $values) {
    if (!empty($values['wpfactory_custom_text'])) {
        wc_add_order_item_meta($item_id, 'Гравировка', $values['wpfactory_custom_text']);
    }
}

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

Условное отображение полей: примеры и советы

В WooCommerce часто требуется показывать или скрывать поля в зависимости от выбора пользователя. Для этого можно использовать JavaScript и PHP вместе. Например, если у вас есть поле выбора «Тип упаковки», и для определенного варианта нужно показать дополнительное текстовое поле:

add_action('woocommerce_before_add_to_cart_button', 'wpfactory_packaging_options');
function wpfactory_packaging_options() {
    echo '<label for="wpfactory_packaging">Тип упаковки</label>';
    echo '<select id="wpfactory_packaging" name="wpfactory_packaging">
            <option value="standard">Стандартная</option>
            <option value="gift">Подарочная</option>
          </select>';
    echo '<div id="wpfactory_gift_message_field" style="display:none;">
            <label for="wpfactory_gift_message">Сообщение для подарка</label>
            <input type="text" id="wpfactory_gift_message" name="wpfactory_gift_message" />
          </div>';
    ?>
    <script>
    (function($){
        $('#wpfactory_packaging').change(function(){
            if ($(this).val() === 'gift') {
                $('#wpfactory_gift_message_field').show();
            } else {
                $('#wpfactory_gift_message_field').hide();
                $('#wpfactory_gift_message').val('');
            }
        });
    })(jQuery);
    </script>
    <?php
}

// Сохраняем данные и отображаем их в корзине и заказе аналогично примеру выше.

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

Интеграция с плагинами WPSHOP для расширения возможностей

Если вы используете продукты из экосистемы WPSHOP, например, Custom Fields Pro, настройка динамических полей становится ещё проще. Плагин позволяет создавать условные поля, управлять их типами (текст, дата, выбор) и выводить их как на странице товара, так и в админке заказов.

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

Выводы и дальнейшие шаги

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

Если вы хотите попробовать расширенные возможности с поддержкой и обновлениями, обратите внимание на Custom Fields Pro от WPSHOP – это надежное решение для профессиональных магазинов.

Как добавить динамические поля в WooCommerce