Slik legger du til Asyntai AI-chatbot på Webflow

Trinn-for-trinn-guide for Webflow-nettsider

Plattform:

Trinn 1: Hent innbyggingskoden din

First, go to your Asyntai Dashboard and scroll down to the "Embed Code" section. Copy your unique embed code which will look like this:

<script>(function(){var l=function(){var s=document.createElement("script");s.src="https://widget.asyntai.com/static/js/chat-widget.js";s.async=true;s.setAttribute("data-asyntai-id","YOUR_WIDGET_ID");document.head.appendChild(s)};if(document.readyState==="complete"){l()}else{window.addEventListener("load",l)}})();</script>

Merk: Koden ovenfor er bare et eksempel. Du må kopiere din egen unike innbyggingskode fra Dashbordet ditt, da den inneholder din personlige widget-ID.

Trinn 2: Legg til kode via nettstedsinnstillinger (alle sider)

For å legge til chatboten på alle sider av Webflow-nettstedet ditt samtidig:

Logg inn på Webflow-kontoen din og velg prosjektet ditt
Klikk på tannhjulikonet (Nettstedsinnstillinger) i venstre sidefelt
Klikk på «Custom Code» i innstillingsmenyen
Bla ned til «Footer Code»-seksjonen (før </body>-taggen)
Lim inn Asyntai-innbyggingskoden din
Klikk på «Save Changes»
Publiser nettstedet ditt for å bruke endringene

Tips: Å legge til koden i Footer-delen plasserer den rett før den avsluttende </body>-taggen, noe som anbefales for chat-widgeter da det ikke vil bremse sideinnlastingen.

Alternativ: Sidespesifikk tilpasset kode

Hvis du bare vil ha chatboten på bestemte sider:

Åpne prosjektet ditt i Webflow Designer
Klikk på Sider-panelet (mappeikon) i venstre sidefelt
Hold musepekeren over siden du vil redigere og klikk på tannhjulikonet
Bla ned til "Egendefinert kode"
Lim inn Asyntai-innbyggingskoden din i "Før </body>-taggen"-seksjonen
Klikk på «Lagre»
Publiser nettstedet ditt

Alternativ: Bruk av Embed-element

Du kan også legge til chatboten ved hjelp av Embed-elementet hvor som helst på siden din:

Åpne prosjektet ditt i Webflow Designer
Klikk på "+"-knappen for å åpne Legg til-panelet
Søk etter "Embed" eller finn det under Komponenter
Dra Embed-elementet til siden din
Lim inn Asyntai-innbyggingskoden din i koderedigereren
Klikk på «Save & Close»
Publiser nettstedet ditt

Viktig: Når du bruker Embed-elementet, må du legge det til på hver side der du vil ha chatboten. For installasjon på hele nettstedet, bruk metoden via Nettstedsinnstillinger ovenfor.

Trinn 3: Bekreft installasjonen

Etter at du har publisert nettstedet ditt, åpne det i en ny nettleserfane eller inkognitovindu. Du bør se chat-widget-knappen i nedre høyre hjørne. Klikk på den for å forsikre deg om at den åpnes og fungerer riktig.

Ser du ikke widgeten? Sørg for at du har publisert nettstedet ditt etter at du har lagt til koden. Tilpasset kode vises kun på det publiserte nettstedet, ikke i Designer-forhåndsvisningen. Prøv å tømme nettleserbufferen eller se i et inkognitovindu.

Legge til AI-søkefeltet

AI-søkefeltet er en egen widget med sin egen kode. Legg det til sammen med chatten, eller alene. Det krever Standard-planen eller høyere: på en lavere plan vises feltet, men returnerer ingen resultater.

Legg til attributtet data-replace i script-taggen, så tar feltet plassen til det temaet allerede har. Legg det til under Site Settings, Custom Code, Footer, samme sted som chatkoden, slik at det havner rett før den avsluttende body-taggen.

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

Les hele veiledningen for AI-søkefeltet