Kuidas lisada Asyntai tehisintellekti vestlusrobot mis tahes veebisaidile

Universal guide for HTML, custom sites, and static generators

Platvorm:

1. samm: Hankige oma manuskood

Esmalt minge oma Asyntai juhtpaneelile ja kerige alla jaotiseni "Manuskood". Kopeerige oma unikaalne manuskood, mis näeb välja selline:

<script async src="https://asyntai.com/static/js/chat-widget.js" data-asyntai-id="YOUR_WIDGET_ID"></script>

Märkus: Ülalolev kood on vaid näide. Peate kopeerima oma unikaalse manuskoodi oma juhtpaneelilt, kuna see sisaldab teie isiklikku vidina ID-d.

2. samm: Lisage oma HTML-faili

Lihtsaim viis vestlusroboti lisamiseks on kleepida manuskood otse oma HTML-faili:

Avage oma HTML-fail tekstiredaktoris
Leidke sulgev silt </body>
Kleepige oma Asyntai manuskood vahetult enne </body> silti
Salvestage fail

<!DOCTYPE html>
<html>
<head>
  <title>My Website</title>
</head>
<body>
  <!-- Your website content -->

  <!-- Asyntai Chatbot - Add before closing body tag -->
  <script async src="https://asyntai.com/static/js/chat-widget.js" data-asyntai-id="YOUR_WIDGET_ID"></script>
</body>
</html>

Vihje: Skripti lisamine enne sulgevat </body> silti tagab, et see laadib pärast teie lehe sisu, mis on jõudluse seisukohalt optimaalne ega aeglusta teie lehte.

Mitme lehega veebisaitide jaoks

Kui teie veebisaidil on mitu HTML-lehte, on teil mitu võimalust:

Valik A: Lisage igale lehele

Lisage manuskood igale HTML-failile, kus soovite vestlusroboti ilmumist.

Valik B: Kasutage ühist jaluse kaasamist

Kui kasutate serveripoolseid kaasamisi (SSI), PHP kaasamisi või sarnaseid:

Looge fail footer.html (või footer.php)
Lisage Asyntai manuskood sellesse faili
Lisage see jalusefail kõikidele oma lehtedele:
 <?php include 'footer.php'; ?>

Valik C: JavaScripti dünaamiline laadimine

Looge üks JavaScripti fail, mis laadib vestlusroboti kõikidele lehtedele:

Looge fail nimega asyntai-loader.js:
(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); })();
Asendage YOUR_WIDGET_ID oma tegeliku vidina ID-ga
Lisage see skript kõikidele oma lehtedele:
<script src="/js/asyntai-loader.js"></script>

Staatiliste saidi generaatorite jaoks

Kui kasutate staatilist saidi generaatorit, lisage manuskood oma põhipaigutusse või mallile:

Jekyll

Lisage faili _includes/footer.html või _layouts/default.html

Hugo

Lisage faili layouts/partials/footer.html või layouts/_default/baseof.html

Gatsby

Add to gatsby-browser.js or use gatsby-ssr.js

Next.js

Lisage faili pages/_document.js või kasutage komponenti next/script

Nuxt.js

Add to nuxt.config.js under head.script

Eleventy (11ty)

Lisage oma põhipaigutusse kaustas _includes/

Astro

Lisage faili src/layouts/Layout.astro enne </body>

VuePress

Lisage faili .vuepress/config.js jaotisesse head

React / Vue / Angular rakenduste jaoks

Ühe lehe rakenduste (SPA) jaoks saate skripti lisada oma index.html faili või laadida selle dünaamiliselt:

React (index.html meetod)

<!-- In public/index.html, before </body> -->
<script async src="https://asyntai.com/static/js/chat-widget.js" data-asyntai-id="YOUR_WIDGET_ID"></script>

React (useEffect meetod)

// In your App.js or a component
useEffect(() => {
  const script = document.createElement('script');
  script.src = 'https://asyntai.com/static/js/chat-widget.js';
  script.async = true;
  script.setAttribute('data-asyntai-id', 'YOUR_WIDGET_ID');
  document.body.appendChild(script);
  return () => document.body.removeChild(script);
}, []);

Vue (failis main.js või App.vue)

// In mounted() or onMounted()
const script = document.createElement('script');
script.src = 'https://asyntai.com/static/js/chat-widget.js';
script.async = true;
script.setAttribute('data-asyntai-id', 'YOUR_WIDGET_ID');
document.body.appendChild(script);

Angular (failis index.html)

<!-- In src/index.html, before </body> -->
<script async src="https://asyntai.com/static/js/chat-widget.js" data-asyntai-id="YOUR_WIDGET_ID"></script>

3. samm: Kontrollige paigaldust

Pärast koodi lisamist avage oma veebisait uues brauseri vahekaardil või inkognito aknas. Peaksite nägema vestlusvidina nuppu alumises paremas nurgas. Klõpsake sellel, et veenduda, et see avaneb ja töötab korrektselt.

Ei näe vidinat? Kontrollige, et skript on korrektselt paigutatud enne </body> silti. Veenduge, et teie brauseri konsoolis pole JavaScripti vigu (vajutage F12 arendustööriistade avamiseks). Proovige brauseri vahemälu tühjendada või vaadata inkognito aknas.

Oluline: Vestlusrobot nõuab, et teie veebisait oleks serveeritud HTTP või HTTPS kaudu (mitte avatud otse failina). Kohapeal testimisel kasutage kohalikku arendusserverit.

Dokumentatsioon