Cara Menambah Chatbot AI Asyntai ke Umbraco

Platform:

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

Langkah 1: Dapatkan Kod Benam Anda

Pertama, pergi ke Papan Pemuka Asyntai anda dan tatal ke bawah ke bahagian "Kod Benam". Salin kod benam unik anda yang akan kelihatan seperti ini:

Langkah 2: Edit Templat Master (Disyorkan)

Cara paling mudah untuk menambah chatbot ke semua halaman adalah dengan mengedit templat Master anda:

1. Log masuk ke Backoffice Umbraco anda
2. Pergi ke Settings dalam bar sisi kiri
3. Kembangkan Templates
4. Klik pada templat Master anda (atau templat layout utama yang digunakan oleh laman anda)
5. Cari tag penutup </body>
6. Tampal kod benam Asyntai anda sejurus sebelum tag </body>
7. Klik "Save"

Alternatif: Menggunakan Jenis Dokumen Tetapan Laman

Untuk lebih fleksibiliti, anda boleh menambah medan tersuai untuk menguruskan skrip footer:

1. Pergi ke Settings → Document Types
2. Edit jenis dokumen Site Settings anda (atau cipta satu jika ia tidak wujud)
3. Tambah sifat baharu dipanggil "Footer Scripts" dengan jenis data Textarea
4. Simpan Jenis Dokumen
5. Pergi ke Content dan edit nod Site Settings anda
6. Tampal kod benam Asyntai anda dalam medan Footer Scripts
7. Dalam templat Master anda, tambah kod ini sebelum </body>:
   @Html.Raw(Model.Value("footerScripts"))
8. Simpan kedua-dua kandungan dan templat

Alternatif: Menggunakan Folder Scripts

Anda juga boleh mencipta fail JavaScript dalam Backoffice Umbraco:

1. Pergi ke Settings → Scripts
2. Klik kanan pada Scripts dan pilih "Create"
3. Cipta fail baharu bernama asyntai-chatbot.js
4. Tambah kod berikut:
   (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. Gantikan YOUR_WIDGET_ID dengan ID widget sebenar anda
6. Simpan fail
7. Sertakan skrip ini dalam templat Master anda sebelum </body>:
   <script src="/scripts/asyntai-chatbot.js"></script>

Alternatif: Khusus Halaman dengan RenderSection

Jika anda hanya mahu chatbot pada halaman tertentu:

1. Dalam templat Master anda, tambah sebelum </body>:
   @RenderSection("footerScripts", required: false)
2. Dalam templat halaman tertentu di mana anda mahu chatbot, tambah:
   @section footerScripts {
  <script async src="https://asyntai.com/static/js/chat-widget.js" data-asyntai-id="YOUR_WIDGET_ID"></script>
}

Langkah 3: Sahkan Pemasangan

Selepas menyimpan perubahan anda, lawati laman web anda dalam tab pelayar baharu atau tetingkap inkognito. Anda sepatutnya melihat butang widget sembang di sudut kanan bawah. Klik untuk memastikan ia terbuka dan berfungsi dengan betul.