---
title: Як встановити агента на Shopify
description: Куди вставити код у тему Shopify, як агент читає каталог магазину, що робити з кошиком та оплатою та як перевірити встановлення.
section: platforms
keywords: Shopify, віджет Shopify, чат для Shopify, ШІ агент Shopify, інтеграція Shopify, theme.liquid, онлайн чат для магазину, ШІ продавець, встановлення агента Shopify, каталог товарів Shopify
updated: 2026-09-06
---
Shopify вже має каталог у машиночитному вигляді, тому агент збирає товари точніше, ніж будь-де інде: ціни, варіанти, наявність та фотографії надходять безпосередньо з магазину.

## Крок 1. Вставте код у тему

1. В адмінці Shopify відкрийте **«Онлайн-магазин» → «Теми»**.
2. Біля активної теми натисніть **… → «Редагувати код»**.
3. У списку файлів знайдіть `layout/theme.liquid`.
4. Вставте рядок коду з кабінету безпосередньо перед закриваючим тегом `</body>`.
5. Збережіть.

Альтернатива без редагування теми: **«Онлайн-магазин» → «Налаштування» → «Власний код»** або будь-який застосунок для вставки скриптів. Результат той самий.

```liquid
    <!-- Commerce Agents -->
    <script src="https://comag.vibevox.pro/widget.js" data-slug="your-slug" async></script>
  </body>
</html>
```

Точний рядок візьміть у кабінеті кнопкою «Скопіювати код»: у ньому вже підставлено адресу вашої вітрини.

## Крок 2. Зберіть каталог

У налаштуваннях вкажіть адресу магазину та запустіть аналіз. Обхідник Shopify читає структуровані дані товарів: назву, ціну, валюту, наявність, опис та фотографії. Варіанти (розміри, кольори) потрапляють у картку як характеристики.

Повторний аналіз оновлює ціни та наявність. Запускайте його після значних змін асортименту: агент не підключається до вашої бази напряму, а працює зі зібраним каталогом.

## Крок 3. Залиште оплату магазину

На Shopify оплату в чаті вмикати не потрібно. Правильна схема:

1. У налаштуваннях магазину вкажіть посилання на кошик — зазвичай `https://your-domain/cart`.
2. Агент підбирає товар, показує картку і за кнопкою веде покупця до кошика Shopify.
3. Оформлення та оплата відбуваються звичним шляхом, з усіма вашими правилами доставки та податків.

Щоб бачити, які діалоги завершуються покупкою, вставте фрагмент пікселя покупки на сторінку подяки. У Shopify це **«Налаштування» → «Оформлення замовлення» → «Сторінка статусу замовлення» → «Додаткові скрипти»**. Фрагмент з підстановкою номера замовлення та суми лежить у кабінеті, у розділі «Віджет і посилання».

## Товар потрапляє до кошика, не перериваючи розмову

Тут Shopify розкривається краще за інші платформи. Агент показує картки товарів з фотографією, ціною та кнопкою, але кнопка не просто веде на сторінку — вона кладе товар до кошика магазину.

Працює це так: у посиланні товару Shopify є ідентифікатор варіанта, агент передає його вашому ж кошику через штатний інтерфейс `/cart/add.js`. Сторінка не перезавантажується, діалог не переривається, покупець бачить коротке підтвердження і продовжує вибирати. Товар при цьому вже в кошику Shopify — з усіма вашими правилами знижок, податків та доставки.

Якщо варіанта в посиланні немає, агент відкриває картку товару, і покупець додає його сам. Нічого не ламається, просто на один клік більше.

Коли людина готова, кнопка «Перейти до оформлення» веде до `/cart`, де все вже зібрано. Далі — звичайна каса Shopify.

І окремо про контекст: агент читає структуровані дані сторінки, на якій відкрито чат. Покупець дивиться конкретний товар і запитує «є в розмірі L?» — агент розуміє, про що йдеться, без перепитувань.

- Відкрийте магазин в інкогніто, дочекайтеся кнопки чату.
- Запитайте про товар за назвою — має з'явитися картка з ціною.
- Натисніть «Перейти до оформлення» — має відкритися кошик Shopify.
- Оформіть тестове замовлення та переконайтеся, що покупка відмітилася у «Заявках».

## Чат у тон вітрині

Тема Shopify задає настрій всьому магазину, і чат не повинен з нього випадати. У налаштуваннях віджета три варіанти: світла, темна та «як у відвідувача», яка слідує за налаштуваннями пристрою покупця.

Для магазинів з темною темою встановлюйте темну жорстко, для світлих — світлу. Акцентний колір кнопок залишається вашим в обох випадках.

## Крок 4. Перевірте

## Поширені проблеми

**Віджет зник після зміни теми.** Код живе у файлі теми. Зміна або оновлення теми стирає правку — вставте код заново або використовуйте Custom code, який від теми не залежить.

**Каталог зібрався не повністю.** Обхід бере товари з публічних сторінок. Приховані від каталогу та чернетки не потрапляють, це правильно.

**Ціни в каталозі застаріли.** Запустіть аналіз сайту заново, він оновить ціни та наявність за наявними картками.

**Віджет конфліктує із застосунком чату.** Залиште один чат: два вікна в одному куті заважають одне одному і плутають покупця.

## Поширені запитання

### Чи потрібен застосунок із Shopify App Store

Ні. Агент підключається одним рядком коду, застосунок встановлювати не потрібно.

### Чи вміє агент показувати варіанти товару

Так, варіанти потрапляють у картку як характеристики: розмір, колір, об'єм. Вибір конкретного варіанта покупець робить у кошику Shopify.

### Як бути з кількома валютами

Агент показує ціни у валюті каталогу, яку визначає під час обходу. Мультивалютність Shopify працює далі, на стороні кошика та оплати.

### Чи знатиме агент про залишки

Наявність береться на момент аналізу. Для товарів, які часто закінчуються, запускайте аналіз частіше або додайте в умови рядок про те, що наявність уточнюється під час оформлення.

### Чи впливає віджет на швидкість магазину

Скрипт завантажується асинхронно і не блокує відтворення. На метрики Core Web Vitals це практично не впливає.