# Интеграция с MODX

##### Установка корзины Кактус в CMS MODX

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

[![image-1599723877215.png](https://wiki.kak2c.ru/uploads/images/gallery/2020-09/scaled-1680-/image-1599723877215.png)](https://wiki.kak2c.ru/uploads/images/gallery/2020-09/image-1599723877215.png)

В открывшемся поле с кодом шаблона в тег head вставить следующее:

```JavaScript
<!-- умная корзина kak2c -->
	<script src="https://static.kak2c.ru/v2/kak2c.checkout.js"></script>
	<link rel="stylesheet" href="https://static.kak2c.ru/v2/kak2c.checkout.css">
	
	<script>
  document.addEventListener("DOMContentLoaded", function (){
	 var kak2c_domain = "shopXXXXXX";
	 kaktusWidget({
      	domain: kak2c_domain,
      
      	//Необязательные коллбэки. Назначение похоже на события выше.
      	basketClickCallback: function(){
          //Вызывается при открытии попапа корзины
        },

        newOrderCreatedCallback: function(){
          //Вызывается при создании заказа
        }
    });
    $(".open-cart").on('click', function(event) {
            event.stopPropagation();
            event.preventDefault();
            var productId = $(this).data('productId');
            console.log('productId: ' + productId);
            kaktusWidget.changeCart({
							variantId: productId,
							count: 1, 
							operation: 'ADD'
						});
						setTimeout(function () {
							$(".basket-round").click();
						}, 1000);	
			
		});
  });
	</script>
	
	<!-- /умная корзина kak2c -->
```

shopXXXXXX необходимо заменить на ID аккаунта, который можно найти в ЛК Кактус в Настройках.

##### Установка кнопки "Купить"

Зайдите в раздел Элементы - Чанки и выберите необходимый чанк, в котором будет размещаться кнопка.

[![image-1599725491274.png](https://wiki.kak2c.ru/uploads/images/gallery/2020-09/scaled-1680-/image-1599725491274.png)](https://wiki.kak2c.ru/uploads/images/gallery/2020-09/image-1599725491274.png)

Код кнопки:

```JavaScript
	<a href="javascript:void(0);" class="shop__btn btn add_item open-cart quick-order__link" data-product-id="[[+productId]]">Купить</a>
```

##### Связка товаров

Для корректной интеграции товаров необходимо поле идентификатора, связывающее товары, заведённые в MODX, с товарами в Кактусе.

В разделе Элементы - Дополнительные поля необходимо создать новое поле идентификатора- в нашем случае добавить дополнительную колонку к существующей форме товаров.

[![image-1599726178307.png](https://wiki.kak2c.ru/uploads/images/gallery/2020-09/scaled-1680-/image-1599726178307.png)](https://wiki.kak2c.ru/uploads/images/gallery/2020-09/image-1599726178307.png)

Создать новое дополнительное поле tvproductId

> Инструкцию о создании дополнительных полей в MODX можно найти [здесь](https://itchief.ru/lessons/modx-revo/modx-tv).

[![image-1599728980346.png](https://wiki.kak2c.ru/uploads/images/gallery/2020-09/scaled-1680-/image-1599728980346.png)](https://wiki.kak2c.ru/uploads/images/gallery/2020-09/image-1599728980346.png)

После чего данное поле необходимо добавить в существующую форму товара.

[![image-1599728674473.png](https://wiki.kak2c.ru/uploads/images/gallery/2020-09/scaled-1680-/image-1599728674473.png)](https://wiki.kak2c.ru/uploads/images/gallery/2020-09/image-1599728674473.png)

[![image-1599729233460.png](https://wiki.kak2c.ru/uploads/images/gallery/2020-09/scaled-1680-/image-1599729233460.png)](https://wiki.kak2c.ru/uploads/images/gallery/2020-09/image-1599729233460.png)

После этого в разделе с товарами появится искомая колонка.

[![image-1599726178307.png](https://wiki.kak2c.ru/uploads/images/gallery/2020-09/scaled-1680-/image-1599726178307.png)](https://wiki.kak2c.ru/uploads/images/gallery/2020-09/image-1599726178307.png)

ID товара можно найти в Личном кабинете Кактуса в разделе Товары - Все товары в карточке искомого товара.

[![image-1599729503730.png](https://wiki.kak2c.ru/uploads/images/gallery/2020-09/scaled-1680-/image-1599729503730.png)](https://wiki.kak2c.ru/uploads/images/gallery/2020-09/image-1599729503730.png)