Jak přidat Asyntai AI chatbota do Umbraco

Platforma:

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

Krok 1: Získejte svůj vkládací kód

Nejprve přejděte na svůj Asyntai Dashboard a přejděte dolů k sekci „Embed Code". Zkopírujte svůj unikátní kód pro vložení, který bude vypadat takto:

Krok 2: Úprava hlavní šablony (doporučeno)

Nejjednodušší způsob, jak přidat chatbota na všechny stránky, je úprava hlavní šablony:

1. Přihlaste se do svého backoffice Umbraco
2. Přejděte na Settings v levém postranním panelu
3. Rozbalte Šablony
4. Klikněte na svou šablonu Master (nebo hlavní šablonu layoutu, kterou váš web používá)
5. Najděte uzavírací značku </body>
6. Vložte svůj Asyntai embed kód těsně před značku </body>
7. Klikněte na "Save"

Alternativa: Použití typu dokumentu Nastavení webu

Pro větší flexibilitu můžete přidat vlastní pole pro správu skriptů v zápatí:

1. Přejděte na Settings → Document Types
2. Upravte typ dokumentu Site Settings (nebo vytvořte nový, pokud neexistuje)
3. Přidejte novou vlastnost s názvem "Footer Scripts" s datovým typem Textarea
4. Uložte typ dokumentu
5. Přejděte na Content a upravte uzel Site Settings
6. Vložte kód Asyntai do pole Footer Scripts
7. Ve své hlavní šabloně přidejte tento kód před </body>:
   @Html.Raw(Model.Value("footerScripts"))
8. Uložte obsah i šablonu

Alternativa: Použití složky Scripts

Můžete také vytvořit soubor JavaScript v Umbraco Backoffice:

1. Přejděte na Settings → Scripts
2. Klikněte pravým tlačítkem na Scripts a vyberte "Create"
3. Vytvořte nový soubor s názvem asyntai-chatbot.js
4. Přidejte následující kód:
   (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. Nahraďte YOUR_WIDGET_ID svým skutečným ID widgetu
6. Uložte soubor
7. Vložte tento skript do hlavní šablony před </body>:
   <script src="/scripts/asyntai-chatbot.js"></script>

Alternativa: Pro konkrétní stránku s RenderSection

Pokud chcete chatbota pouze na konkrétních stránkách:

1. Ve své hlavní šabloně přidejte před </body>:
   @RenderSection("footerScripts", required: false)
2. Do šablony konkrétní stránky, kde chcete chatbota, přidejte:
   @section footerScripts {
  <script async src="https://asyntai.com/static/js/chat-widget.js" data-asyntai-id="YOUR_WIDGET_ID"></script>
}

Krok 3: Ověřte instalaci

Po uložení změn navštivte svůj web v nové kartě prohlížeče nebo v anonymním okne. V pravém dolním rohu byste měli vidět tlačítko chatového widgetu. Klikněte na něj a ověřte, že se správně otevírá a funguje.