Задача. Необходимо настроить автоматическое обновление корзины в Woocommerce при изменении количества товаров.
Решение 1. Использовать плагины:
- WooCommerce AJAX Cart (Moises Heberle) — к автообновлению корзины + небольшое оформление полей ввода количества.
- Ajax Cart AutoUpdate for WooCommerce (taisho)
- WooCommerce Ajax Cart Plugin
Решение 2. Вариант кода №1, вставить в functions.php, Если скрывать кнопку обновления не нужно, то <style>...</style>
убираем:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
|
// Обновление корзины при изменении колич.товара
add_action( ‘wp_footer’, ‘cart_update_qty_script’ );
function cart_update_qty_script() {
if (is_cart()) : // Проверяем страница корзины это или нет
?>
<style>
/* Если хотим скрыть кнопку кнопку “Обновить”. Если не нужно, то убираем весь style */
button[name=”update_cart”]{display: none;}</style>
<script>
jQuery( function( $ ) {
$( ‘body’ ).on( ‘change’, ‘.qty’, function() { // поле с количеством имеет класс .qty
setTimeout(function() {
$( ‘[name=”update_cart”]’ ).trigger( ‘click’ );
}, 1300 ); // 1300 – задержка в мс до срабатывания
} );
} );
</script>
<?php
endif;
}
// End Обновление корзины при изменении колич.товара
|
Решение 3. Вариант кода №2, если кнопки для изменения количества товаров в корзине кастомные, нужно добавить еще функцию срабатывания по событию клика на кнопки инкремента и декремента. Смотрим какие классы у кнопок добавления / уменьшения количества товара и заменяем .quantity-button.dec
и .quantity-button.inc
на свои:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
|
// Обновление корзины при изменении колич.товара
add_action( ‘wp_footer’, ‘cart_update_qty_script’ );
function cart_update_qty_script() {
if (is_cart()) : // Проверяем страница корзины это или нет
?>
<style>
/* Если хотим скрыть кнопку кнопку “Обновить”. */
button[name=”update_cart”]{display: none;}</style>
<script>
jQuery( function( $ ) {
$( ‘body’ ).on( ‘change’, ‘.qty’, function() { // поле с количеством имеет класс .qty
setTimeout(function() {
$( ‘[name=”update_cart”]’ ).trigger( ‘click’ );
}, 1300 );
} );
$( ‘body’ ).on( ‘click’, ‘.quantity-button.inc, .quantity-button.dec’, function() { // элементы инкремента/декремента
setTimeout(function() {
$( ‘[name=”update_cart”]’ ).trigger( ‘click’ );
}, 1300 );
} );
} );
</script>
<?php
endif;
}
// End Обновление корзины при изменении колич.товара
|