Как отключить AJAX загрузку товаров в WooCommerce

AJAX загрузка товаров в WooCommerce — удобная функция, которая подгружает товары при навигации по категориям или фильтрах без полной перезагрузки страницы. Однако в некоторых случаях она вызывает проблемы: некорректное отображение товаров, конфликты с кастомными скриптами или плагинами, а также затруднения с SEO. В этой статье подробно разберём, как правильно отключить AJAX загрузку товаров в WooCommerce с примерами кода и рекомендациями.

Почему стоит отключить AJAX загрузку товаров в WooCommerce

AJAX помогает улучшить UX за счёт плавной подгрузки контента, но есть весомые причины её отключить:

• Несовместимость с кастомными темами и плагинами. Некоторые темы и плагины плохо работают с AJAX, вызывая баги.
• Проблемы с SEO. Если AJAX подгружает товары без обновления URL, поисковики могут не индексировать весь контент.
• Сложности с аналитикой. Веб-аналитика иногда не фиксирует динамически загруженные товары.
• Отладка и разработка. При отладке проще работать с классической загрузкой страницы.

Если вы столкнулись с подобными проблемами, отключение AJAX — рациональный шаг.

Как отключить AJAX загрузку в WooCommerce: варианты и примеры кода

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

Отключение AJAX в фильтрах WooCommerce (виджетах фильтрации)

Если вы используете виджеты фильтрации по цене или атрибутам, которые подгружают товары динамически, отключить AJAX можно с помощью фильтра в functions.php вашей темы или плагина:

function wpassist_disable_ajax_filters( $args ) {
    $args['ajax'] = false;
    return $args;
}
add_filter( 'woocommerce_layered_nav_ajax_args', 'wpassist_disable_ajax_filters' );

Этот код отключит AJAX для виджета "Фильтр по атрибуту". Аналогично можно отключить AJAX для других фильтров, если они используют этот фильтр.

Отключение AJAX в пагинации каталога

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

Например, если в вашей теме используется скрипт "ajax-pagination.js", можно отключить его так:

function wpassist_dequeue_ajax_pagination() {
    wp_dequeue_script( 'ajax-pagination' );
}
add_action( 'wp_enqueue_scripts', 'wpassist_dequeue_ajax_pagination', 100 );

После этого пагинация будет работать стандартным способом с перезагрузкой страницы.

Отключение AJAX добавления в корзину для архивов

Иногда AJAX применяется для добавления товаров в корзину прямо с каталога. Чтобы отключить эту функцию:

function wpassist_disable_ajax_add_to_cart() {
    remove_action( 'wp_footer', 'woocommerce_add_to_cart_fragments', 20 );
}
add_action( 'wp_enqueue_scripts', 'wpassist_disable_ajax_add_to_cart', 99 );

Этот код удалит фрагменты AJAX для обновления корзины после добавления товара, заставляя страницу перезагружаться.

Проверка и тестирование после отключения AJAX

После внесённых изменений обязательно протестируйте сайт:

• Проверьте фильтры и пагинацию каталога — должны работать с полной перезагрузкой.
• Убедитесь, что добавление товаров в корзину обновляет страницу.
• Проверьте, что нет JavaScript ошибок в консоли браузера.
• Проверьте корректность URL в адресной строке при навигации — для SEO важно, чтобы URL менялся.

Если проблемы исчезли и поведение стало ожидаемым — задача решена.

Дополнительные рекомендации по работе с AJAX в WooCommerce

Если вам всё же нужна AJAX функциональность, но с минимальными проблемами, рассмотрите следующие советы:

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

Помните, что AJAX — мощный инструмент, но он требует аккуратной настройки.

Пример простого AJAX добавления товара с минимальным конфликтом

Вот пример функции для темы или плагина, которая добавляет товар в корзину по AJAX с использованием стандартных хуков WooCommerce:

function wpassist_ajax_add_to_cart() {
    $product_id = intval( $_POST['product_id'] );
    if ( $product_id > 0 ) {
        WC()->cart->add_to_cart( $product_id );
        wp_send_json_success( array('cart_count' => WC()->cart->get_cart_contents_count()) );
    } else {
        wp_send_json_error();
    }
}
add_action( 'wp_ajax_wpassist_add_to_cart', 'wpassist_ajax_add_to_cart' );
add_action( 'wp_ajax_nopriv_wpassist_add_to_cart', 'wpassist_ajax_add_to_cart' );

Этот код добавляет обработчик AJAX запроса, который добавляет товар в корзину и возвращает количество товаров в корзине. Для полноценного использования нужно добавить JavaScript, который будет отправлять запрос и обновлять интерфейс.