Автоматическое обновление стоимости товара в WooCommerce при изменении атрибутов

Диагностика проблемы: почему цена не обновляется автоматически

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

Чтобы убедиться, что цена не обновляется автоматически, выполните следующие шаги:

• Откройте вариативный товар на фронтенде сайта;
• Выберите разные комбинации атрибутов и посмотрите, меняется ли цена;
• Если цена остаётся статичной, проблема связана с отсутствием динамического обновления;
• Проверьте консоль браузера на наличие ошибок JavaScript, которые могут блокировать скрипты WooCommerce.

Пошаговое решение: добавляем динамическое обновление цены с учётом пользовательских атрибутов

1. Добавляем пользовательские атрибуты в вариации

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

add_action('woocommerce_product_after_variable_attributes', function($loop, $variation_data, $variation) {
    woocommerce_wp_text_input(array(
        'id' => 'custom_option_price_' . $variation->ID,
        'label' => __('Доп. цена за опцию', 'woocommerce'),
        'value' => get_post_meta($variation->ID, 'custom_option_price', true),
        'desc_tip' => true,
        'description' => __('Дополнительная цена, добавляемая к вариации', 'woocommerce'),
        'type' => 'number',
        'custom_attributes' => array('step' => '0.01', 'min' => '0'),
    ));
}, 10, 3);

add_action('woocommerce_save_product_variation', function($variation_id, $i) {
    if (isset($_POST['custom_option_price_' . $variation_id])) {
        update_post_meta($variation_id, 'custom_option_price', sanitize_text_field($_POST['custom_option_price_' . $variation_id]));
    }
}, 10, 2);

2. Отправляем дополнительную цену в JavaScript и обновляем цену на фронтенде

Добавим скрипт, который будет учитывать дополнительную цену при выборе вариации:

add_action('wp_footer', function() {
    if (!is_product()) return;
    ?>
    <script>
    jQuery(function($){
        var variations = {};
        $('.variations_form').find('option').each(function(){
            var variationId = $(this).data('variation_id');
            if (variationId) {
                var addPrice = parseFloat($(this).data('custom_option_price')) || 0;
                if (!variations[variationId]) variations[variationId] = 0;
                variations[variationId] = addPrice;
            }
        });

        $('.variations_form').on('found_variation', function(event, variation) {
            var basePrice = parseFloat(variation.display_price);
            var variationId = variation.variation_id;
            var addPrice = 0;

            $.each(variation.attributes, function(key, val) {
                // Здесь можно расширить логику для дополнительных атрибутов
            });

            // Получаем дополнительную цену из мета вариации
            $.ajax({
                url: wc_add_to_cart_params.ajax_url,
                type: 'POST',
                data: {
                    action: 'get_custom_option_price',
                    variation_id: variationId
                },
                success: function(response) {
                    addPrice = parseFloat(response.data) || 0;
                    var newPrice = basePrice + addPrice;
                    $('.single_variation .price').html(woocommerce_price_format(newPrice));
                }
            });
        });

        function woocommerce_price_format(price) {
            return wc_price(price);
        }
    });
    </script>
    <?php
});

add_action('wp_ajax_get_custom_option_price', 'get_custom_option_price_callback');
add_action('wp_ajax_nopriv_get_custom_option_price', 'get_custom_option_price_callback');
function get_custom_option_price_callback() {
    if (empty($_POST['variation_id'])) wp_send_json_error();
    $variation_id = intval($_POST['variation_id']);
    $custom_price = get_post_meta($variation_id, 'custom_option_price', true);
    wp_send_json_success(floatval($custom_price));
}

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

После добавления кода сделайте следующее:

• Перейдите на страницу вариативного товара;
• Выберите разные вариации и убедитесь, что цена меняется с учётом дополнительной цены;
• Проверьте консоль браузера на отсутствие ошибок JavaScript;
• При необходимости проверьте AJAX-запросы в инструментах разработчика — они должны корректно возвращать дополнительную цену.

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

• Цена не меняется: Возможно, AJAX-запрос не срабатывает. Проверьте, правильно ли подключён wc_add_to_cart_params.ajax_url и что PHP-функция обработчика AJAX зарегистрирована.
• Цена меняется, но отображается некорректно: Убедитесь, что форматирование цены происходит через функцию wc_price(), а не через кастомные методы.
• Дополнительная цена не сохраняется: Проверьте, что мета-данные вариаций добавляются и сохраняются корректно при редактировании товара в админке.
• JavaScript ошибки: Конфликты с другими плагинами или темой могут блокировать скрипты. Отключите конфликтующие плагины для проверки.

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

• Кешируйте результаты AJAX-запросов, если дополнительных цен много и они редко меняются.
• Используйте sanitize_text_field() или floatval() для защиты от XSS и некорректных данных в AJAX.
• Ограничьте AJAX-запросы только страницами товаров, чтобы снизить нагрузку.
• При большом количестве вариаций рассмотрите возможность передачи всех данных цен в JavaScript сразу, чтобы избежать множества AJAX-запросов.

Сравнение вариантов реализации