Корзина в Битрикс: настройка и кастомизация sale.basket

Корзина — компонент, через который проходит каждый покупатель перед оформлением заказа. От того, насколько удобно он собран, напрямую зависит, сколько посетителей доходит до оплаты, а сколько уходит на этапе «добавил в корзину и передумал».

Разберём устройство sale.basket, работу с товарами через AJAX без перезагрузки страницы и типичные доработки, которые почти всегда нужны сверх стандартного шаблона.

Базовое подключение

<$APPLICATION->IncludeComponent(
    'bitrix:sale.basket',
    'main',
    [
        'PATH_TO_ORDER'       => '/personal/order/make/',
        'HIDE_COUPON'         => 'N',
        'QUANTITY_FLOAT'      => 'N',
        'USE_PREPAYMENT'      => 'N',
        'SET_TITLE'           => 'Y',
        'SHOW_NUM_PRODUCTS'   => 'Y',
        'AJAX_MODE'           => 'Y',
        'ACTION_VARIABLE'     => 'action',
        'PRODUCT_QUANTITY_VARIABLE' => '',
        'COLUMNS_LIST'        => ['PROPS', 'PRICE', 'QUANTITY', 'SUM', 'DELETE'],
    ]
);?>

Ключевые параметры разбираем ниже.

AJAX-обновление количества

При включённом AJAX_MODE компонент сам обрабатывает изменение количества, удаление позиции и применение купона без перезагрузки. Взаимодействие идёт через параметр ACTION_VARIABLE: значения передаются в форме, а компонент их разбирает.

Если требуется своя кнопка «плюс/минус» вместо стандартного поля ввода, логику удобно вынести в отдельный запрос через AJAX-контроллер, а не переписывать сам компонент. Общий подход к таким запросам в Битрикс разобран в статье AJAX в Битрикс: BX.ajax, ajax_mode и контроллеры D7.

Счётчик товаров в шапке

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

<$APPLICATION->IncludeComponent(
    'bitrix:sale.basket.basket.line',
    'header',
    [
        'PATH_TO_BASKET' => '/personal/basket/',
        'SHOW_NUM_PRODUCTS' => 'Y',
        'SHOW_TOTAL_PRICE'  => 'Y',
        'SHOW_PERSONAL_LINK' => 'N',
        'POSITION_FIXED'    => 'N',
    ]
);?>

Компонент подключает JavaScript-обработчик события изменения корзины, и при добавлении товара с любой страницы каталога счётчик в шапке обновляется сам, без перезагрузки — то же событие можно слушать и в собственных скриптах, чтобы, например, показать всплывающее уведомление «Товар добавлен».

Добавление товара из карточки

Кнопка «В корзину» на карточке или в списке товаров работает через отдельный компонент добавления, обычно встроенный в шаблон catalog.element или catalog.section. Основной механизм — передача действия через ссылку или форму с идентификатором товара:

<form action="<?= POST_FORM_ACTION_URL ?>" method="post">
    <input type="hidden" name="action" value="ADD2BASKET">
    <input type="hidden" name="id" value="<?= $arItem['ID'] ?>">
    <input type="hidden" name="quantity" value="1">
    <button type="submit">В корзину</button>
</form>

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

Торговые предложения в корзине

Если каталог использует торговые предложения — например, один товар с разными размерами или цветами, — в корзину должен попадать конкретный вариант, а не родительский элемент. Это определяется тем, какой PRODUCT_ID передаётся при добавлении: идентификатор торгового предложения, а не самого товара.

Ошибка здесь встречается часто: в корзине оказываются все варианты с одинаковым названием и без различия по свойствам, потому что добавлялся идентификатор родительского элемента.

Отложенные товары

Штатный механизм позволяет переносить позиции между корзиной и списком отложенных — это сохраняет интерес покупателя, который не готов купить сейчас. Параметр в компоненте:

'HIDE_NOT_AVAILABLE' => 'N',
'BASKET_TYPE'         => 'basket',

Товары со статусом «отложен» хранятся в той же таблице, что и обычная корзина, но с другим типом — переключение между режимами не требует создания отдельного инфоблока или таблицы.

Проверка наличия и актуальности цены

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

Эта проверка происходит при каждом обращении к корзине, и на каталоге с частым обновлением цен через обмен с 1С стоит убедиться, что компонент сверяется именно с актуальной ценой, а не с закешированным значением — типичная причина, когда цена в корзине отличается от цены на карточке товара.

Кастомизация шаблона

Стандартный шаблон редко подходит без переработки. Копируется он по тому же принципу, что и остальные компоненты:

/local/templates/main/components/bitrix/sale.basket/main/
    template.php
    result_modifier.php
    script.js

В result_modifier.php удобно досчитывать собственные данные — например, показать экономию от скидки отдельной строкой или сгруппировать товары по производителю. Общие правила работы с этим файлом разобраны в статье о шаблонах компонентов.

Частые проблемы

Итог

Корзина в Битрикс собирается из нескольких связанных компонентов: sale.basket для самой страницы, sale.basket.basket.line для счётчика в шапке и форм добавления на карточках товаров. Все они работают через общий механизм действий и событие изменения состояния.

Две вещи стоит проверить в первую очередь при внедрении: что в корзину действительно попадает нужный вариант товара, а не родительский элемент, и что цена в ней всегда сверяется с актуальным каталогом, а не показывает значение на момент добавления.