Научете как да интегрирате вашия персонализиран чатбот в уебсайта си с лекота.
Интегрирането на чатбота Swiftron във вашия уебсайт е просто и бързо. С еднократна интеграция и без нужда от постоянни промени, можете безпроблемно да подобрите ангажираността на клиентите си. Следвайте тези лесни стъпки, за да започнете:
Стъпка 1: Копирайте интеграционния код
Отидете на Страницата за интеграция на Swiftron и копирайте следния код:
<script async type="module" project-id="YOUR_PROJECT_ID" lang="auto" src="https://swiftron.eu/static/js/chatbot-boot.min.js"></script>
- идентификатор на проекта: Това е вашият уникален идентификатор на проекта и ще бъде предварително попълнен.
- език: Целевият език за вашия чатбот. Можете да използвате:
- Всеки валиден езиков код от ISO 639 езикови кодове (например, 'en' за английски, 'de' за немски).
- 'auto', който избира езика въз основа на настройките на браузъра на потребителя.
- 'site', който използва езика, посочен в HTML заглавката на уебсайта. Това прочита стойността от
document.documentElement.lang
и задава езика на чатбота съответно.
Стъпка 2: Поставете кода във вашия уебсайт
Използване на конструктор на уебсайтове:
Ако използвате конструктори на уебсайтове като Jimdo, WordPress или Squarespace, следвайте техните инструкции, за да вмъкнете персонализиран код:
- Jimdo: Как да вмъкна собствен код
- WordPress: Използване на блок за собствен HTML
- Squarespace: Добавяне на собствен код на сайта ви
Управление на собствения ви код:
Вмъкнете копирания интеграционен код в HTML на всяка страница, на която искате да се появи чатботът. Ето един пример:
<!
DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Your Site</title>
</head>
<body>
<div>Your Content</div>
</body>
<script async type="module"
project-id="YOUR_PROJECT_ID"
lang="auto"
src="https://swiftron.eu/static/js/chatbot-boot.min.js">
</script>
</html>
Настройка на бутона за превключване на чатбота (по избор)
Ако вече имате съществуващо комуникационно поле или искате да създадете свой собствен бутон за отваряне или затваряне на чатбота, можете лесно да го интегрирате, като добавите неговото ID в 'Бутон за превключване на чатбота' настройките на Страницата за интеграция на Swiftron.
Пример:
<button id="btn-toggle-chatbot">Вашият икона на чатбота</button>
Просто задайте полето 'Бутон за превключване на чатбота' на ID-то на вашия бутон, напр. 'btn-toggle-chatbot'. Типът на бутона може да бъде какъвто и да е (напр. div, span). Не е необходимо да добавяте никакъв JavaScript или обработчици на събития; чатботът на Swiftron автоматично ще открие този бутон и ще обработи необходимата логика.
Ако не бъде намерен елемент с предоставеното ID или ако полето 'Бутон за превключване на чатбота' е празно, Swiftron ще създаде свой собствен бутон за превключване на чатбота на вашия сайт.
Персонализиране на разположението на чатбота (по желание)
Можете да вмъкнете чатбота в конкретен елемент, като посочите неговото ID в полето 'Персонализиране на разположението на чатбота' на Страницата за интеграция на Swiftron. Чатботът ще се появи вътре в този елемент и ще замени всяко съществуващо съдържание в него.
В този случай няма да бъде показван или използван бутон за превключване на чатбота. Чатботът винаги ще бъде видим вътре в посочения елемент и не може да бъде минимизиран от потребителя.