Розумний помічник — це не тільки вікно чату в кутку. Той самий віджет уміє вбудовуватися прямо в сторінки вашого сайту: додати під карткою товару кнопку «Підібрати аналог», показати блок «ТОП характеристик», дати покупцеві пояснити виділений у тексті термін. Кнопки ви придумуєте самі, а відповідає на них ШІ, який знає ваш каталог і бачить сторінку, на якій зараз перебуває покупець.
Ця стаття — про сторінкову частину помічника: блоки, кнопки, товари, зв'язок із сайтом. Про саме вікно чату, операторів, базу знань і листування з клієнтами — окрема стаття, розумний чат для сайту. Віджет один, налаштування живуть в одному вікні, просто на різних вкладках.
Де це у програмі
- Вікно
- «Категорії» → плитка «Налаштування віджету - Розумний помічник»
- Вкладки
- Налаштування, Інформація, Вигляд, Посилання, Ціни, Обмеження, Події, Блоки
- Про що ця стаття
- останні п'ять вкладок; перші три — у статті про чат
1
Блоки2
Події3
Обмеження4
Ціни5
Додати блок- Блоки — місця на сторінках сайту, куди помічник вставляє свої кнопки й вміст.
- Події — код JS вашого сайту для дій із кошиком, обраним і порівнянням.
- Обмеження — які товари помічнику дозволено пропонувати.
- Ціни — з якого поля брати ціну і як її показувати.
- Кнопка додавання блоку; параметри (тип сторінки, селектор, позиція, вигляд) задаються в картці блоку.
Типи сторінок: як помічник розуміє, де він
Щоб відповідати по суті, помічник має знати, що зараз перед покупцем: картка товару, список категорії чи оформлення замовлення. Для цього заведені типи сторінок, і в кожного описано, як його впізнати й що з нього взяти:
- Як упізнати — CSS-селектори характерних елементів, шматок адреси, характерний текст на сторінці;
- Поля товару — селектори, з яких читати назву, артикул, ціну, наявність, фото, характеристики;
- Кнопки сторінки — селектори «Купити», «В обране», «До порівняння», «Оформити»;
- Посилання розділів — пошук, бренди, акції, блог, контакти, доставка й оплата.
Заповнювати всі селектори одразу не треба. Мінімум, який дає користь, — упізнавання картки товару й селектор назви: після цього кнопки в блоках уже отримують назву товару й можуть говорити «про цей товар», а не абстрактно.
Блоки: ваші кнопки в сторінці
Блок — це місце на сторінці, куди помічник вставляє свій вміст. У списку блоків видно тип, назву, опис, порядок і активність, а всі параметри розміщення задаються в картці блоку:
| Параметр | Що задає |
|---|---|
| Тип сторінки | де блок з'являється: у картці товару, у категорії, на оформленні |
| Селектор CSS | елемент сторінки, відносно якого вставляти |
| Позиція | Перед, Після, На початок, Наприкінці або Замінити цей елемент |
| Вигляд блоку | За замовчуванням, Текст або ТОП характеристик |
Позиція «Замінити» прибирає елемент вашого сайту й ставить на його місце блок помічника. Це потрібно нечасто — наприклад, замінити стандартний список характеристик на «ТОП характеристик». Помилковий селектор із цією позицією зламає верстку сторінки, тому перевіряйте результат одразу після збереження.
Кнопки блоку
Усередині блоку живуть кнопки — це і є головне. У кожної кнопки:
- Назва й спливаюча підказка — те, що бачить покупець;
- Завдання для AI (промпт) — що саме зробити, коли кнопку натиснули;
- Вигляд відображення — куди покласти відповідь: Під кнопкою, у спливаюче вікно або в чат;
- Активність — кнопку можна вимкнути, не видаляючи.
У промпті працюють підстановки, і саме вони роблять кнопку осмисленою:
| Макрос | Що підставляється |
|---|---|
{ITEM_NAME} | назва товару зі сторінки |
{ITEM_ID} | ідентифікатор товару |
{HIGHLIGHTED_TEXT} | текст, який покупець виділив на сторінці (або взятий селектором) |
Приклади кнопок, які працюють у справжніх магазинах: «Чим відрізняється від попередньої моделі» (промпт із {ITEM_NAME}, відповідь під кнопкою), «Підійде мені?» (відповідь у чат, щоб покупець далі уточнював), «Що входить у комплект» (спливаюче вікно). Ставте відповідь у чат тоді, коли розмова має продовжитися, і під кнопку — коли це довідка на один раз.
Панель для виділеного тексту
Окремий режим: покупець виділяє будь-який текст на сторінці — і біля виділення з'являється ваша панель із кнопками. Кнопки згруповані у вкладки, у кожної своя дія: виконати промпт ШІ (з тим самим {HIGHLIGHTED_TEXT}), відкрити посилання або виконати ваш JS.
Це закриває типову задачу довгих описів: покупець не розуміє термін у характеристиках і замість того, щоб піти гуглити, отримує пояснення на місці.
Товари: ціни й обмеження
Коли помічник показує товари — у відповіді, у блоці чи в підбірці — він бере їх із каталогу Elbuz. Дві вкладки вирішують, як саме.
Ціни
- Поле джерело ціни — з якого поля каталогу брати ціну;
- Код валюти, символ зліва, символ праворуч — як писати суму;
- Показувати стару ціну, РРЦ, акційну ціну — що саме виводити поруч;
- Округляти ціни й відображати десяткові — вигляд числа.
Обмеження
- Обмеження виведення товарів — скільки позицій показувати;
- відбір за категоріями й атрибутами — щоб помічник пропонував тільки те, що ви продаєте свідомо;
- тільки товари в наявності — не радити те, чого немає.
Обмеження за категоріями — це не косметика, а захист від незручних відповідей. Без нього помічник може запропонувати покупцеві товар із архівної чи службової категорії, яку ви не показуєте на вітрині. Каталог у нього один — той самий, що й у магазині.
Посилання й події
Помічник живе на вашому сайті, тому має знати його адреси й уміти натискати його кнопки.
Посилання — шаблони адрес: товар, категорія, фото товару, пошук, кошик, оформлення, список бажань, порівняння, акції. Якщо товари приїхали із зовнішнього джерела, посилання можна брати звідти — за кодом джерела й ідентифікатором шаблону, з макросом {external_url}.
Події — код JS вашого сайту для дій: додати в кошик і прибрати з нього, додати в обране, додати до порівняння. Поки функції не вказані, кнопки показуються, але нічого не роблять.
Витягування ID товару
Щоб дії працювали, помічник має знати ідентифікатор товару на вашому боці. Задається CSS-селектор або регулярний вираз, яким витягти ID зі сторінки, і окремий перемикач «Завжди витягувати ID зі сторінки товару» — навіть якщо ідентифікатор уже відомий із каталогу.
Другий перемикач потрібен, коли ідентифікатори в Elbuz і на сайті розійшлися — після переносу каталогу чи зміни CMS. Тоді джерелом істини стає сторінка, а не база.
Shop API: покупець і його замовлення
Найглибший рівень інтеграції. На вкладці «Посилання» є блок Shop API: адреса модуля на боці вашого магазину й секретний ключ (HMAC), однаковий тут і в модулі.
Що це дає: помічник дізнається, хто саме зараз на сайті — авторизація покупця передається в чат, — і може запитувати його замовлення наживо, без синхронізації. Тобто на питання «де моє замовлення» відповідь береться з вашого магазину в момент запитання, а не з копії даних.
Ключ Shop API — це доступ до даних покупців. Він задається парою: тут і в модулі магазину. Кнопка генерації створює новий ключ, але після цього його треба одразу прописати в модулі — інакше зв'язок обірветься й помічник перестане впізнавати покупців.
Чого помічник не робить
- Не змінює сайт за вас: блоки вставляються за селекторами, які ви вказали.
- Не вгадує структуру сторінок — типи сторінок і селектори полів описуєте ви.
- Не додає товар у кошик сам: дії викликають функції вашого сайту.
- Не замінює чат: вікно листування, оператори й база знань — окрема частина.
- Не працює без коду інтеграції на сайті — це той самий код, що й у чату.
Розбір частих проблем
| Що ви бачите | Чому так | Що зробити |
|---|---|---|
| Блок не з'явився на сторінці | селектор не знаходить елемент або не збігся тип сторінки | перевірити селектор блоку й правила впізнавання типу сторінки |
| Блок став не туди | обрана не та позиція відносно елемента | спробувати «Перед» / «Після» / «На початок» / «Наприкінці» |
| Зламалася верстка сторінки | позиція «Замінити» прибрала потрібний елемент сайту | змінити позицію або уточнити селектор |
| Кнопка відповідає загальними словами | у промпті немає макросів — ШІ не знає, про який товар мова | додати {ITEM_NAME}, а за потреби {ITEM_ID} |
| Відповідь з'являється не там, де очікували | обраний інший «Вигляд відображення» | вибрати «Під кнопкою», «Спливаюче вікно» або «Чат» |
| Панель для виділеного тексту не показується | немає активних вкладок або кнопок панелі | додати хоча б одну кнопку й увімкнути її |
| Помічник радить товари не з тих категорій | не задане обмеження за категоріями | налаштувати відбір на вкладці «Обмеження» |
| Радить те, чого немає в наявності | не увімкнено «тільки в наявності» | увімкнути на вкладці «Обмеження» |
| Ціна у відповіді не така, як на сайті | обране інше поле джерела ціни або не показується акційна | звірити налаштування на вкладці «Ціни» |
| Кнопка «До кошика» нічого не робить | не заданий код JS вашого сайту | заповнити функцію на вкладці «Події» |
| Дії працюють не на тому товарі | неправильно витягується ID товару | перевірити селектор або регулярний вираз витягування ID |
| Помічник не впізнає покупця | не налаштований Shop API або ключі розійшлися | звірити адресу модуля й секретний ключ з обох боків |
Часті питання
Чим помічник відрізняється від чату?
Це один віджет. «Чат» — вікно листування з ШІ й операторами. «Помічник» — те, що той самий віджет робить на сторінках: вставляє блоки з вашими ШІ-кнопками, дає панель для виділеного тексту, показує товари. Налаштування лежать в одному вікні, на різних вкладках.
Як зробити свою кнопку на сторінці товару?
Створити блок із типом сторінки «товар», указати CSS-селектор місця й позицію, а всередині блоку додати кнопку: назву, завдання для ШІ з макросом {ITEM_NAME} і вигляд відповіді — під кнопкою, у спливаючому вікні або в чаті.
Що таке панель для виділеного тексту?
Покупець виділяє текст на сторінці й бачить ваші кнопки: пояснити, порівняти, знайти схоже. У промпті такої кнопки працює макрос {HIGHLIGHTED_TEXT} — у нього підставляється саме виділене.
Навіщо заповнювати селектори типів сторінок?
Щоб помічник розумів, що перед покупцем, і брав зі сторінки назву, ціну, наявність і кнопки. Без цього кнопки в блоках говорять абстрактно, а дії з кошиком не знають, до якого товару застосуватися.
Що дає Shop API?
Помічник дізнається авторизованого покупця й може запитувати його замовлення у вашому магазині наживо, без синхронізації. Налаштовується парою: адреса модуля магазину й однаковий секретний ключ тут і там.
Чому помічник пропонує не ті товари?
Бо каталог у нього той самий, що й у магазині, а відбір не налаштований. На вкладці «Обмеження» задають категорії, атрибути, кількість позицій і показ тільки того, що є в наявності.
Суміжні теми
- Розумний чат для сайту — вікно чату, оператори, база знань, аналітика.
- Розумний пошук — сусідній віджет того самого сервісу.
- Конфігуратор товарів — ще один вбудовуваний віджет.
- Атрибути — звідки береться «ТОП характеристик».
- Боти підтримки — той самий чат у Telegram і Viber.