WooCommerce: решение проблемы с неактивными кнопками корзины после обновления

Диагностика проблемы неактивных кнопок корзины

После обновления WooCommerce или темы часто возникает ситуация, когда кнопки «Добавить в корзину» или «Перейти в корзину» становятся неактивными (disabled) или вообще не реагируют на клики. Это приводит к потере конверсии и негативному пользовательскому опыту.

Основные признаки:

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

Как проверить источник проблемы

• Откройте консоль браузера (F12 > Console) — ищите ошибки JS;
• Отключите все плагины кроме WooCommerce и переключитесь на базовую тему (например, Storefront);
• Проверьте, активна ли корзина WooCommerce (например, wc_cart_hash cookie);
• Проверьте, загружаются ли скрипты WooCommerce в футере (woocommerce-add-to-cart.js и jquery);
• Проверьте корректность AJAX-запросов добавления в корзину в Network вкладке DevTools.

Пошаговое решение проблемы с неактивными кнопками корзины

1. Очистка кеша и отключение минификации

Кэш и оптимизация JS/CSS часто вызывают конфликты. Очистите кеш на сервере, в плагинах кеширования (например, WP Rocket, W3 Total Cache) и CDN (Cloudflare). Временно отключите минификацию JS и CSS.

2. Проверка и исправление конфликтов скриптов

Добавьте следующий код в functions.php вашей дочерней темы, чтобы убедиться, что скрипты WooCommerce правильно подключаются:

function fix_woocommerce_scripts_order() {
    if (class_exists('WooCommerce')) {
        wp_dequeue_script('woocommerce');
        wp_dequeue_script('wc-add-to-cart');
        wp_enqueue_script('woocommerce', plugins_url('/assets/js/frontend/woocommerce.min.js', WC_PLUGIN_FILE), array('jquery'), WC_VERSION, true);
        wp_enqueue_script('wc-add-to-cart', plugins_url('/assets/js/frontend/add-to-cart.min.js', WC_PLUGIN_FILE), array('jquery', 'woocommerce'), WC_VERSION, true);
    }
}
add_action('wp_enqueue_scripts', 'fix_woocommerce_scripts_order', 100);

Этот код принудительно переподключает основные скрипты WooCommerce в правильном порядке и в футере.

3. Проверка поддержки AJAX добавления в корзину

Если кнопки не работают на страницах архивов товаров (категории, магазин), убедитесь, что в настройках WooCommerce включена опция «Включить AJAX-добавление в корзину на страницах архивов» (WooCommerce > Настройки > Товары > Общие).

4. Исправление JS ошибок, связанных с jQuery

В последних версиях WordPress jQuery обновился, и некоторые плагины или темы используют устаревший код. Добавьте в functions.php следующий код для замены jQuery на версию из WordPress core:

function replace_jquery_with_wp_version() {
    if (!is_admin()) {
        wp_deregister_script('jquery');
        wp_enqueue_script('jquery');
    }
}
add_action('wp_enqueue_scripts', 'replace_jquery_with_wp_version');

Это часто решает конфликты с jQuery и зависимостями WooCommerce.

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

• Откройте страницу с товарами и попробуйте добавить товар в корзину без перезагрузки;
• Проверьте в консоли браузера отсутствие ошибок JavaScript;
• Убедитесь, что кнопка «Добавить в корзину» становится активной и корректно работает;
• Проверьте работу корзины в мобильной версии и на других браузерах;
• Проверьте, что AJAX-запросы на добавление товара проходят (во вкладке Network).

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

• Ошибка: Скрипты WooCommerce не загружаются из-за конфликтов с кешированием.
  Решение: Очистите кеш, отключите оптимизацию JS, добавьте wp_enqueue_script с правильными зависимостями.
• Ошибка: Конфликт jQuery версий приводит к неработоспособности кнопок.
  Решение: Используйте стандартный jQuery из WordPress core, отключите сторонние версии.
• Ошибка: Кнопка неактивна только на страницах архива.
  Решение: Включите AJAX-добавление в корзину в настройках WooCommerce.
• Ошибка: Тема или плагин перезаписывает обработчики кликов кнопок.
  Решение: Используйте режим диагностики — отключайте плагины по одному, переключайтесь на стандартную тему.

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

• Используйте детальный лог ошибок PHP и JS (например, плагин Query Monitor), чтобы быстро находить конфликты;
• Не отключайте WooCommerce скрипты полностью — это может нарушить логику работы корзины;
• Для кеширования используйте плагин Clearfy Pro, он умеет безопасно исключать критичные скрипты WooCommerce из минификации и оптимизации (https://wpshop.ru/plugins/clearfy?utm_source=wpzoom.ru&utm_medium=article&utm_campaign=woocommerce-reshenie-problemy-neaktivnyh-knopok-korziny-posle-obnovleniya);
• Регулярно обновляйте WooCommerce и тему, чтобы избежать несовместимостей;
• Всегда тестируйте обновления на staging-сервере, а не на живом сайте.

Сравнение способов решения проблемы