Як додати AI чат-бот Asyntai до Umbraco

Платформа:

Umbraco

HTML/Custom WordPress Shopify WooCommerce BigCommerce Ecwid Wix Squarespace Webflow Weebly HubSpot Tilda Adobe Experience Manager Duda Google Sites Bludit Plesk Concrete CMS Craft CMS Contentful Docusaurus Strapi Joomla Kentico Drupal Magento Blogger Bitrix TYPO3 PrestaShop OpenCart Ghost Hugo Statamic Umbraco Volusion Moodle SilverStripe Grav October CMS ProcessWire Sanity ExpressionEngine Sylius Backdrop CMS MODX Bagisto PayloadCMS e107 CrafterCMS Kirby MedusaCMS DatoCMS GoDaddy Framer Bubble Carrd Jimdo Strikingly Kajabi Teachable Thinkific ClickFunnels Hostinger Unbounce Leadpages Systeme.io Instapage

Крок 1: Отримайте код для вставки

Спочатку перейдiть до вашої Панелi керування Asyntai та прокрутiть вниз до роздiлу "Код для вставки". Скопiюйте унiкальний код для вставки, який виглядатиме так:

Крок 2: Редагування головного шаблону (Рекомендовано)

Найпростіший спосіб додати чат-бот на всі сторінки - відредагувати ваш головний шаблон:

1. Увійдіть до вашого бекофісу Umbraco
2. Перейдiть до Settings на лiвiй бiчнiй панелi
3. Розгорніть Templates
4. Натисніть на ваш шаблон Master (або основний шаблон макета, який використовує ваш сайт)
5. Знайдiть закриваючий тег </body>
6. Вставте ваш код для вставки Asyntai безпосередньо перед тегом </body>
7. Натиснiть "Save"

Альтернатива: Використання типу документа Site Settings

Для більшої гнучкості ви можете додати власне поле для управління скриптами футера:

1. Перейдіть до Settings → Document Types
2. Відредагуйте тип документа Site Settings (або створіть його, якщо він не існує)
3. Додайте нову властивість з назвою "Footer Scripts" з типом даних Textarea
4. Збережіть тип документа
5. Перейдіть до Content та відредагуйте вузол Site Settings
6. Вставте ваш код вбудовування Asyntai в поле Footer Scripts
7. У вашому головному шаблоні додайте цей код перед </body>:
   @Html.Raw(Model.Value("footerScripts"))
8. Збережіть як контент, так і шаблон

Альтернатива: Використання папки Scripts

Ви також можете створити файл JavaScript у бекофісі Umbraco:

1. Перейдіть до Settings → Scripts
2. Натисніть правою кнопкою миші на Scripts та виберіть "Create"
3. Створіть новий файл з назвою asyntai-chatbot.js
4. Додайте наступний код:
   (function() {
  var script = document.createElement('script');
  script.async = true;
  script.src = 'https://asyntai.com/static/js/chat-widget.js';
  script.setAttribute('data-asyntai-id', 'YOUR_WIDGET_ID');
  document.body.appendChild(script);
})();
5. Замiнiть YOUR_WIDGET_ID на ваш фактичний ID вiджету
6. Збережiть файл
7. Включіть цей скрипт у ваш головний шаблон перед </body>:
   <script src="/scripts/asyntai-chatbot.js"></script>

Альтернатива: Для окремих сторінок з RenderSection

Якщо ви хочете чат-бот лише на конкретних сторiнках:

1. У вашому головному шаблоні додайте перед </body>:
   @RenderSection("footerScripts", required: false)
2. У конкретному шаблоні сторінки, де ви хочете чат-бот, додайте:
   @section footerScripts {
  <script async src="https://asyntai.com/static/js/chat-widget.js" data-asyntai-id="YOUR_WIDGET_ID"></script>
}

Крок 3: Перевiрте встановлення

Пiсля збереження змiн вiдвiдайте свiй веб-сайт у новiй вкладцi браузера або в режимi iнкогнiто. Ви повиннi побачити кнопку чат-вiджету в нижньому правому кутi. Натиснiть на неї, щоб переконатися, що вона вiдкривається та працює коректно.