---
title: Уиджет на сайта, линк към агента и приложение на телефона
description: Как да инсталирате агента на сайта с един ред код, как работи краткият линк за социални мрежи и месинджъри и как клиентът инсталира вашия агент на телефона си като приложение.
section: guide
keywords: уиджет за сайт, код за уиджет, Tilda уиджет, Shopify уиджет, WordPress уиджет, линк към AI агент, PWA приложение, push известия, преглед на линк, AI агент за продажби, инсталиране на агент, чатбот за сайт
updated: 2026-09-06
---
Агентът има две лица. На сайта това е прозорец в ъгъла, който се отваря с бутон. В социалните мрежи и месинджърите – страница с кратък линк, която работи като малък магазин и се инсталира на телефона като приложение. Каталогът, условията, диалозите и заявките при това са общи: агентът е един.

Всичко описано по-долу се намира в раздел „Уиджет и връзка“.

## Връзка към агента

Кратък адрес от вида `comag.vibevox.pro/c/your-shop`. Поставя се в шапката на профила в Instagram, TikTok или Telegram, изпраща се в WhatsApp, добавя се в описанието под видеоклип в YouTube.

При изпращане в месинджър връзката се разгръща в карта: обложка, име на магазина и описание. И трите полета се настройват:

- **Заглавие на превюто** — по подразбиране името на магазина.
- **Описание на превюто** — кратка фраза за това какво може да се попита.
- **Обложка** — генерира се автоматично от вашия акцентен цвят, лого и снимки на продукти. Може да качите своя, размер 1200 на 630 пиксела.

Най-лесно е да проверите как изглежда превюто, като изпратите линка на себе си в Telegram.

## Код за сайта

Един ред, който се вмъква преди затварящия таг `</body>` на всички страници. Копира се с бутон в акаунта.

Къде точно да вмъкнете на популярни платформи:

| Платформа | Къде да вмъкнете |
| --- | --- |
| Tilda | „Настройки на сайта“ → „Още“ → „HTML код за body“ |
| Shopify | „Тема“ → „Редактиране на кода“ → `theme.liquid`, преди `</body>` |
| WordPress | „Външен вид“ → „Редактор на тема“ → `footer.php`, или плъгин за вмъкване на код |
| Wix | „Настройки“ → „Потребителски код“ → „добавяне в края на Body“ |
| Ваш собствен сайт | Директно в шаблона преди `</body>` |

След вмъкване в долния десен ъгъл ще се появи бутон. Позицията може да се смени на лява в настройките, цветът и темата – също там.

> [!tip] Уиджетът се зарежда асинхронно и не забавя страницата. Ако имате настроен строг CSP, разрешете домейна `comag.vibevox.pro` в `script-src` и `connect-src`.

## Оформление

Настройки, които купувачът вижда:

- **Име на магазина и име на асистента.** Второто е подписът на събеседника в заглавието на чата.
- **Поздрав.** Първата фраза. Добрият поздрав обещава полза, а не просто поздравява.
- **Подсказки в началото на диалога.** До четири бутона с въпроси. Празно – ще се генерират автоматично по каталог.
- **Тон на общуване.** От списък или ваш собствен: „топъл и кратък“, „експертен, на Вие“.
- **Акцентен цвят.** Един цвят задава бутона, връзките и осветяването на картите.
- **Лого.** То ще стане и икона на приложението на телефона.
- **Бутон за микрофон.** Разпознаване на реч в браузъра. Ако браузърът не поддържа, купувачът ще запише гласово съобщение и то ще бъде разшифровано от Gemini.

Отдясно има предварителен преглед на живо: той се променя, докато пишете. Бутонът „Запазване“ прехвърля промените на сайта.

## Светла и тъмна тема

Чатът има две оформления и те се превключват в едно поле от настройките – „Тема“.

| Стойност | Какво вижда купувачът |
| --- | --- |
| Като на посетителя | Темата се адаптира към настройките на телефона или компютъра му: през нощта тъмна, през деня светла |
| Светла | Винаги светъл прозорец, независимо от устройството |
| Тъмна | Винаги тъмен прозорец |

По подразбиране е избрано „като на посетителя“, и в повечето случаи това е правилният избор: човек с тъмна тема на телефона няма да получи бяла светкавица в лицето, а този, който е свикнал със светла, ще види познатия прозорец.

Фиксирана тема е необходима, когато самият сайт е направен в един стил. Тъмен лендинг със светъл чат в ъгъла изглежда като кръпка, и обратното. В такъв случай задайте същата тема като на сайта и уиджетът ще се слее с дизайна.

Акцентният цвят работи върху двете теми: бутоните, връзките и осветяването на картите приемат вашия фирмен цвят, а фонът и текстът се променят заедно с темата. Най-лесно е да проверите и двата варианта в предварителния преглед отдясно – той се прерисува веднага, докато превключвате стойността.

## Продуктови карти водят към вашия сайт

Агентът отговаря не с плътен текст, а с карти: снимка, име, цена, бутон. Зад бутона винаги стои адрес – страницата на продукта на вашия сайт или оригиналната публикация в социалната мрежа, ако картата е събрана оттам.

В рамките на уиджета на сайта преходът се осъществява в същия прозорец, за да не се натрупват раздели. На страницата на агента чрез връзката картата се отваря в нов раздел, за да не се изгуби диалогът.

За магазини на Shopify и WooCommerce има приятна подробност: бутонът не просто отваря продукта, а го добавя в кошницата на магазина чрез стандартния механизъм на платформата. Подробности в статиите за [Shopify](/wiki/bg/platform-shopify) и [WordPress](/wiki/bg/platform-wordpress).

И още: уиджетът чете маркировката на продукта на страницата, където е отворен, и я предава на агента. Затова въпросът „а в синьо има ли?“ на продуктовата карта се разбира в контекст, без уточнение за какво става дума.

## Приложение на телефона на купувача

Страницата на агента може да се инсталира като приложение. Купувачът отваря връзката от телефона, вижда предложение да добави към началния екран и получава икона с вашето лого.

- **Име под иконата** — една дума до 12 знака. Празно – ще вземем първата дума от името на магазина.
- **Икона** — каченото лого. Ако няма лого, се използва логото на Commerce Agents.
- На iPhone инсталацията става през „Споделяне“ → „На начален екран“, това е ограничение на Safari, и агентът сам подсказва стъпките.

След инсталация на купувача могат да се изпращат push-известия от раздел „Диалози“. Разрешение за тях той дава сам, като натисне камбанката в заглавието на чата.

## Прикачени файлове от купувача

В чата има кламер: снимка, видео или аудио до 20 мегабайта. Ако в браузъра няма разпознаване на реч, задържането на микрофона записва гласово съобщение.

Gemini анализира файла: какво е показано, какъв текст има на изображението, какво е казано на глас. Агентът отговаря въз основа на този анализ, а вие виждате в диалога както самия файл, така и кратко описание. Това е полезно в ниши, където е по-лесно да се покаже, отколкото да се опише: резервни части, ремонт, избор по снимка.

## Пиксел за покупка за сайт с кошница

Ако плащането се извършва на вашия сайт, а не в чата, вмъкнете на страницата „Благодарим за поръчката“ кратък фрагмент от акаунта, като добавите номера на поръчката и сумата. Покупката ще се свърже с диалога и в статистиката ще бъде видно кои кореспонденции завършват с продажба.

## Проверка

Три минути, които си струва да отделите след настройката:

1. Отворете сайта в режим инкогнито и натиснете бутона на уиджета. Задайте въпрос за продукт.
2. Отворете линка към агента от телефон. Проверете дали се предлага инсталация.
3. Изпратете линка на себе си в месинджър и вижте превюто.
4. Погледнете в „Диалози“: там трябва да се появят и двете кореспонденции.

## Често задавани въпроси

### Уиджетът на сайта и линкът — това различни агенти ли са?

Един и същ. Каталогът, условията, диалозите и заявките са общи. Различава се само оформлението: на сайта е прозорец в ъгъла, а по линка — страница на цял екран, която може да се инсталира на телефон.

### Може ли да се промени адресът на линка?

Адресът се формира от името на магазина при създаване на витрината. Ако е нужен друг, пишете ни в Telegram — ще го сменим ръчно, за да не повредим вече разпространените линкове.

### Уиджетът ще забави ли сайта?

Не. Скриптът тежи малко и се зарежда асинхронно, след основното съдържание на страницата. Самият прозорец за чат се зарежда само когато купувачът натисне бутона.

### Какво вижда купувачът, ако агентът е изключен?

Нищо: бутонът не се появява, а страницата по линка показва, че агентът е недостъпен. Превключвателят се намира в раздел „Уиджет и линк“.

### Как да премахна надписа „Работи с Commerce Agents“?

Засега никак: надписът остава на всички тарифи. Той е кликаем и води към нашия сайт — това е част от цената, благодарение на която услугата струва 29 € вместо значително по-голяма сума.
