Kako dodati Asyntai AI chatbot na 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

Korak 1: Nabavite svoj kod za ugradnju

Prvo idite na svoju Asyntai nadzornu ploču i pomaknite se prema dolje do odjeljka "Kod za ugradnju". Kopirajte svoj jedinstveni kod za ugradnju koji će izgledati ovako:

Korak 2: Uredite glavni predlozak (Preporuceno)

Najlaksi nacin za dodavanje chatbota na sve stranice je uredivanje glavnog predloska:

1. Prijavite se u svoj Umbraco Backoffice
2. Idite na Postavke u lijevoj bočnoj traci
3. Prosirte Templates
4. Kliknite na svoj Master predlozak (ili glavni predlozak rasporeda koji vasa stranica koristi)
5. Pronađite zatvarajuću oznaku </body>
6. Zalijepite svoj Asyntai kod za ugradnju neposredno prije oznake </body>
7. Kliknite "Spremi"

Alternativa: Koristenje vrste dokumenta postavki stranice

Za vise fleksibilnosti mozete dodati prilagodeno polje za upravljanje skriptama podnozja:

1. Idite na Settings → Document Types
2. Uredite svoju vrstu dokumenta Site Settings (ili je izradite ako ne postoji)
3. Dodajte novo svojstvo nazvano "Footer Scripts" s vrstom podataka Textarea
4. Spremite vrstu dokumenta
5. Idite na Content i uredite cvor Site Settings
6. Zalijepite svoj Asyntai ugradni kod u polje Footer Scripts
7. U svom glavnom predlosku dodajte ovaj kod prije </body>:
   @Html.Raw(Model.Value("footerScripts"))
8. Spremite i sadrzaj i predlozak

Alternativa: Koristenje mape skripti

Takoder mozete izraditi JavaScript datoteku u Umbraco Backofficeu:

1. Idite na Settings → Scripts
2. Desnom tipkom misa kliknite na Scripts i odaberite "Create"
3. Izradite novu datoteku nazvanu asyntai-chatbot.js
4. Dodajte sljedeci kod:
   (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. Zamijenite YOUR_WIDGET_ID svojim stvarnim ID-jem widgeta
6. Spremite datoteku
7. Ukljucite ovu skriptu u svoj glavni predlozak prije </body>:
   <script src="/scripts/asyntai-chatbot.js"></script>

Alternativa: Specificno za stranicu s RenderSection

Ako zelite chatbot samo na odredenim stranicama:

1. U svom glavnom predlosku dodajte prije </body>:
   @RenderSection("footerScripts", required: false)
2. U specificnom predlosku stranice gdje zelite chatbot dodajte:
   @section footerScripts {
  <script async src="https://asyntai.com/static/js/chat-widget.js" data-asyntai-id="YOUR_WIDGET_ID"></script>
}

Korak 3: Provjerite instalaciju

Nakon spremanja promjena, posjetite svoju web stranicu u novoj kartici preglednika ili anonimnom prozoru. Trebali biste vidjeti gumb widgeta za razgovor u donjem desnom kutu. Kliknite ga kako biste provjerili otvara li se i radi li ispravno.