So fügen Sie den Asyntai-KI-Chatbot zu Umbraco hinzu

Plattform:

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

Schritt 1: Ihren Einbettungscode erhalten

Gehen Sie zunächst zu Ihrem Asyntai Dashboard und scrollen Sie zum Abschnitt "Einbettungscode". Kopieren Sie Ihren einzigartigen Einbettungscode, der so aussieht:

Schritt 2: Master-Template bearbeiten (empfohlen)

Der einfachste Weg, den Chatbot auf allen Seiten hinzuzufügen, ist die Bearbeitung Ihres Master-Templates:

1. Melden Sie sich in Ihrem Umbraco-Backoffice an
2. Gehen Sie zu Settings in der linken Seitenleiste
3. Erweitern Sie Templates
4. Klicken Sie auf Ihr Master-Template (oder das Haupt-Layout-Template, das Ihre Website verwendet)
5. Suchen Sie das schließende </body>-Tag
6. Fügen Sie Ihren Asyntai-Einbettungscode direkt vor dem </body>-Tag ein
7. Klicken Sie auf "Save"

Alternative: Site-Settings-Dokumenttyp verwenden

Für mehr Flexibilität können Sie ein benutzerdefiniertes Feld hinzufügen, um Footer-Skripte zu verwalten:

1. Gehen Sie zu Settings → Document Types
2. Bearbeiten Sie Ihren Site Settings-Dokumenttyp (oder erstellen Sie einen, falls er nicht existiert)
3. Fügen Sie eine neue Eigenschaft namens "Footer Scripts" mit dem Datentyp Textarea hinzu
4. Speichern Sie den Dokumenttyp
5. Go to Content and edit your Site Settings node
6. Fügen Sie Ihren Asyntai-Einbettungscode in das Feld Footer Scripts ein
7. Fügen Sie in Ihrem Master-Template diesen Code vor </body> hinzu:
   @Html.Raw(Model.Value("footerScripts"))
8. Speichern Sie sowohl den Inhalt als auch das Template

Alternative: Scripts-Ordner verwenden

Sie können auch eine JavaScript-Datei im Umbraco-Backoffice erstellen:

1. Gehen Sie zu Settings → Scripts
2. Klicken Sie mit der rechten Maustaste auf Scripts und wählen Sie "Create"
3. Create a new file called asyntai-chatbot.js
4. Fügen Sie den folgenden Code hinzu:
   (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. Replace YOUR_WIDGET_ID with your actual widget ID
6. Speichern Sie die Datei
7. Binden Sie dieses Skript in Ihrem Master-Template vor </body> ein:
   <script src="/scripts/asyntai-chatbot.js"></script>

Alternative: Seitenspezifisch mit RenderSection

Wenn Sie den Chatbot nur auf bestimmten Seiten haben möchten:

1. Fügen Sie in Ihrem Master-Template vor </body> hinzu:
   @RenderSection("footerScripts", required: false)
2. In the specific page template where you want the chatbot, add:
   @section footerScripts {
  <script async src="https://asyntai.com/static/js/chat-widget.js" data-asyntai-id="YOUR_WIDGET_ID"></script>
}

Schritt 3: Installation überprüfen

Besuchen Sie nach dem Speichern Ihrer Änderungen Ihre Website in einem neuen Browser-Tab oder Inkognito-Fenster. Sie sollten den Chat-Widget-Button in der unteren rechten Ecke sehen. Klicken Sie darauf, um sicherzustellen, dass er sich öffnet und korrekt funktioniert.