Вбудований чат

Відображайте віджет чату вбудованим на сторінці замість плаваючої бульбашки

Усі плани

Огляд

За замовчуванням віджет чату Asyntai з'являється як плаваюча бульбашка в кутку вашого сайту. За допомогою вбудованого чату ви також можете відобразити чат безпосередньо на вашій сторінці — наприклад, у розділі "Напишіть нам" на вашій головній сторінці.

Плаваюча бульбашка продовжує працювати поруч із вбудованим чатом. Відвідувачі, які не прокрутять до вбудованого розділу, можуть використовувати бульбашку. Обидва мають спільну розмову.

Як це працює

Додайте один тег script Розмістіть його там, де ви хочете, щоб чат з'являвся у вашому HTML

Чат відображається вбудовано Віджет з'являється на цій позиції, завжди видимий, того ж розміру, що й звичайний чат

Бульбашка залишається активною Плаваюча бульбашка залишається в кутку для відвідувачів, які не бачать вбудований чат

Спільна розмова Повідомлення синхронізуються між вбудованим чатом та плаваючим віджетом у реальному часі

Налаштування

Додайте цей єдиний рядок HTML там, де ви хочете, щоб чат з'являвся на вашій сторінці:

<script src="https://asyntai.com/static/js/chat-embed.js" data-asyntai-id="YOUR_WIDGET_ID"></script>

Замініть YOUR_WIDGET_ID на ідентифікатор вашого віджета. Ви можете знайти код вбудовування з попередньо заповненим ідентифікатором на сторінці налаштування вбудованого чату.

Примітка: Основний скрипт chat-widget.js також повинен бути на сторінці. Якщо ви вже встановили віджет Asyntai на вашому сайті, це вже зроблено.

Приклад

Ось як ви можете використати це на головній сторінці:

<section style="max-width: 500px; margin: 0 auto;">
    <h2>Chat with us</h2>
    <p>Ask us anything — our AI assistant is here to help.</p>

    <!-- The chat will appear right here -->
    <script src="https://asyntai.com/static/js/chat-embed.js" data-asyntai-id="YOUR_WIDGET_ID"></script>
</section>

Деталі

Розмір

Вбудований чат відображається того ж розміру, що й плаваючий віджет: 400px завширшки та 650px заввишки на комп'ютері, повна ширина та 550px заввишки на мобільному. Ви можете контролювати його розташування, стилізуючи батьківський контейнер.

Поведінка плаваючої бульбашки

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

Синхронізація повідомлень

Вбудований та плаваючий чат мають спільну розмову. Повідомлення, надіслані з будь-якого з них, відображаються в обох. Використовується та сама сесія, контекст ШІ та історія чату.

Декілька сторінок

Ви можете використовувати вбудований чат на деяких сторінках та звичайний плаваючий віджет на інших. Просто додайте скрипт вбудовування на сторінки, де ви хочете вбудований чат. Розмова переноситься між сторінками як зазвичай.

Попередній перегляд наживо

Ось вбудований чат наживо, щоб ви могли побачити, як він виглядає:

Вимоги

Основний віджет чату Asyntai (chat-widget.js) повинен бути встановлений на сторінці

Працює на всіх планах — оновлення не потрібне

Сумісний з усіма браузерами, які підтримують Shadow DOM (усі сучасні браузери)

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

Документація