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

Потому мы рассмотрим свой механизм добавления в корзину товаров и торговых предложений . В современных реалиях все будем делать ajax добавление в корзину на битрикс.

И так начнем  с  самого начала.

В файле catalog.item/.default/card/template.php  — это шаблон отдельного товара в категории товаров битрикс, находим строку с кнопкой в корзину.

Приблизительно следующего содержания:

 case 'buttons':
?>
<div class="product-item-info-container product-item-hidden"
 data-entity="buttons-block">
<?
if (!$haveOffers)
{
if ($actualItem['CAN_BUY'])
{
                                <a href="javascript:void(0);"
                                 data-ids="<?=$actualItem['ID']?>"
                                 data-count="1"
                                 data-url="<?=SITE_TEMPLATE_PATH?>/ajax/add2basket.php" 
                                 class="product_button button-cart">В корзину</a>
                               				
<?
} 

Для ссылки добавления в корзину прописываем свой уникальный класс или айди. Мы пропишем свой класс addbitrix в итоге у нас получится так:

 case 'buttons':
?>
<div class="product-item-info-container product-item-hidden"
 data-entity="buttons-block">
<?
if (!$haveOffers)
{
if ($actualItem['CAN_BUY'])
{
                                <a href="javascript:void(0);"
                                 data-ids="<?=$actualItem['ID']?>"
                                 data-count="1"
                                 data-url="<?=SITE_TEMPLATE_PATH?>/ajax/add2basket.php" 
                                 class="product_button button-cart addbitrix">В корзину</a>
                               				
<?
}

Идем далее.
Создадим js  файл с следующим содержимым

$(document).ready(function() {
	$('.addbitrix').on('click', function(event) {
                event.preventDefault();

                var $this = $(this);
                var prodId = parseInt($this.data('ids'));
                var cartAddUrl = $this.data('url');
                var cnt = $this.data('count');;

                var ajaxDataSend = {
                    OFFER_ID: prodId,
                    QUANTITY: cnt, 
                    AJAX_ADD_TO_BASKET_WITH_DOP: 'Y',

                };

                ///console.log(ajaxDataSend);

                $.ajax({
                    url:cartAddUrl,
                    type: 'POST',
                    data: ajaxDataSend,

                })
                .done(function(data) {
                    var data = $.parseJSON(data);
                    
                    if(data.RESPONSE == 'OK'){
                        BX.onCustomEvent('OnBasketChange'); // Обновляем корзину

                       //здесь уже Ваше модальное окно с уведомлением об успешном добавлении
                          alert("Товар успешно добавлен в корзину");
                         ///   modal.style.display = "block";
                      
                         
                        
                    }
                })
                .fail(function() {
                    //console.log("error");
                })
                .always(function() {
                    //console.log("complete");
                });


///также нужно добавить прибавление и убавление товара. здесь уже в каждой верстке свои классы, код примерный
$('.product_summ .counter_plus').on('click', function (e) {

        var price  = $('.products_variants input[name=1]:checked').attr('data-price');
        if(price == undefined){
            price = $('#price_current_none_offer').html();
        } 
        var count = $('.product_summ .counter_counter').html();
        $('#btn_basket_add').attr('data-count', count);
        var result = Number(price) * Number(count);
        result = result.toFixed();
        $('.product_summ .product_summ span').html(result + ' p');
        console.log(price);

    });

     $('.product_summ .counter_minus').on('click', function (e) {

        var price  = $('.products_variants input[name=1]:checked').attr('data-price');
        if(price == undefined){
            price = $('#price_current_none_offer').html();

        } 
        var count = $('.product_summ .counter_counter').html();
        if(Number(count) < Number(1)){
            return false;
        }
        var count = $('.product_summ .counter_counter').html();
        $('#btn_basket_add').attr('data-count', count);
        var result = Number(price) * Number(count);
        result = result.toFixed();
        $('.product_summ .product_summ span').html(result + ' p');
        console.log(price);

    });

        });

назовем его addcart.js и выведем его в подвале нашего шаблона.

///Правильное подключение
$APPLICATION->AddHeadScript(SITE_TEMPLATE_PATH."/addcart.js");

далее создаем файл аджакс и размещаем его по пути

<?=SITE_TEMPLATE_PATH?>/ajax/add2basket.php

Содержимое файла

<?
define("NO_KEEP_STATISTIC", true);
define('BX_SESSION_ID_CHANGE', false);
define('NO_AGENT_CHECK', true);

require($_SERVER["DOCUMENT_ROOT"]."/bitrix/modules/main/include/prolog_before.php");

use \Bitrix\Main,
    \Bitrix\Main\Localization\Loc as Loc,
    Bitrix\Main\Loader,
    Bitrix\Main\Config\Option,
    Bitrix\Sale\Delivery,
    Bitrix\Sale\PaySystem,
    Bitrix\Sale,
    Bitrix\Catalog,
    Bitrix\Sale\Order,
    Bitrix\Sale\Basket,
    Bitrix\Currency\CurrencyManager,
    Bitrix\Sale\DiscountCouponsManager,
    Bitrix\Main\Context;
use \Bitrix\Highloadblock as HL;

if(!Loader::includeModule("catalog") ||
 !Loader::includeModule("sale") ||
 !Loader::includeModule("main") || 
!Loader::includeModule("iblock"))
    die();

global $USER;

$SITE_ID = Context::getCurrent()->getSite();
$CURRENCY_CODE = CurrencyManager::getBaseCurrency();

//Форма магазина
if( isset($_REQUEST["AJAX_ADD_TO_BASKET_WITH_DOP"]) &&
 $_REQUEST["AJAX_ADD_TO_BASKET_WITH_DOP"] == "Y" ) {

//     $request = Context::getCurrent()->getRequest();

     $OFFER_ID = intval($request->get("OFFER_ID"));
     $QUANTITY = intval($request->get("QUANTITY"));
     $PRODUCT = CIBlockElement::GetByID(/*CCatalogSku::GetProductInfo(*/$OFFER_ID/*)['ID']*/)->GetNext();
     // Получение корзины для текущего пользователя
$basket = \Bitrix\Sale\Basket::loadItemsForFUser(
   \Bitrix\Sale\Fuser::getId(), 
   \Bitrix\Main\Context::getCurrent()->getSite()
);

if($QUANTITY > 1)  $QUANTITY =  $QUANTITY;
 else   $QUANTITY = 1;

if ($item = $basket->getExistsItem('catalog', $PRODUCT["ID"])){

   //Обновление товара в корзине
   $item->setField('QUANTITY', $item->getQuantity() + $QUANTITY);
   
}else{

   //Добавление товара
   $item = $basket->createItem('catalog', $PRODUCT["ID"]);
   $item->setFields([
      'QUANTITY' => $QUANTITY,
      'CURRENCY' => \Bitrix\Currency\CurrencyManager::getBaseCurrency(),
      'LID' => \Bitrix\Main\Context::getCurrent()->getSite(),
      'PRODUCT_PROVIDER_CLASS' => \Bitrix\Catalog\Product\Basket::getDefaultProviderName() ,
   ]);
}

//Сохранение изменений
$basket->save();

    echo json_encode(Array('RESPONSE' => 'OK'));

}

require($_SERVER["DOCUMENT_ROOT"]."/bitrix/modules/main/include/epilog_after.php");

die();

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

<a href="javascript:void(0);"
                                 data-ids="<?=$actualItem["ID"]?>"
                                 data-count="<?=COUNT_ADD_BASKET?>"
                                 data-url="<?=SITE_TEMPLATE_PATH?>/ajax/addToCart.php" 
                                 class="product_button ваш класс">В корзину</a>