Kako dodati Asyntai AI chatbot na Webflow

Vodič korak po korak za Webflow web stranice

Platforma:

Korak 1: Nabavite svoj kod za ugradnju

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>

Napomena: Gornji kod je samo primjer. Morate kopirati svoj vlastiti jedinstveni kod za ugradnju sa svoje Nadzorne ploče jer sadrži vaš osobni ID widgeta.

Korak 2: Dodajte kod putem postavki web mjesta (sve stranice)

Za dodavanje chatbota na sve stranice vašeg Webflow web mjesta odjednom:

Prijavite se na svoj Webflow račun i odaberite svoj projekt
Kliknite na ikonu zupčanika (Postavke web mjesta) u lijevoj bočnoj traci
Kliknite na "Custom Code" u izborniku postavki
Pomaknite se prema dolje do odjeljka "Footer Code" (prije </body> oznake)
Zalijepite svoj Asyntai kod za ugradnju
Kliknite "Save Changes"
Objavite svoju stranicu kako bi promjene postale aktivne

Savjet: Dodavanje koda u odjeljak Footer postavlja ga neposredno prije završne </body> oznake, što je preporučeno za chat widgete jer neće usporiti učitavanje vaše stranice.

Alternativa: Prilagođeni kod za određenu stranicu

Ako želite chatbot samo na određenim stranicama:

Otvorite svoj projekt u Webflow Designeru
Kliknite na panel Stranice (ikona mape) u lijevoj bočnoj traci
Zadržite pokazivač miša iznad stranice koju želite urediti i kliknite na ikonu zupčanika
Pomaknite se prema dolje do "Custom Code"
Zalijepite svoj Asyntai ugradbeni kod u odjeljak "Before </body> tag"
Kliknite "Spremi"
Objavite svoju stranicu

Alternativa: Korištenje elementa za ugradnju

Također možete dodati chatbot koristeći element za ugradnju bilo gdje na svojoj stranici:

Otvorite svoj projekt u Webflow Designeru
Kliknite gumb "+" za otvaranje panela za dodavanje
Potražite "Embed" ili ga pronađite pod Komponente
Povucite element za ugradnju na svoju stranicu
Zalijepite svoj Asyntai ugradni kod u uredivac koda
Kliknite "Save & Close"
Objavite svoju stranicu

Važno: Kada koristite element za ugradnju, morat ćete ga dodati na svaku stranicu gdje želite chatbot. Za instalaciju na cijelom web mjestu koristite gornju metodu putem postavki web mjesta.

Korak 3: Provjerite instalaciju

Nakon objavljivanja stranice, otvorite je u novoj kartici preglednika ili anonimnom prozoru. Trebali biste vidjeti gumb chat widgeta u donjem desnom kutu. Kliknite na njega kako biste provjerili otvara li se i radi li ispravno.

Ne vidite widget? Provjerite jeste li objavili stranicu nakon dodavanja koda. Prilagođeni kod pojavljuje se samo na objavljenoj stranici, ne u pregledu Designera. Pokušajte očistiti predmemoriju preglednika ili pregledati u anonimnom prozoru.

Dodavanje AI trake za pretraživanje

AI traka za pretraživanje zaseban je widget s vlastitim kodom. Dodajte je uz chat ili samostalno. Zahtijeva paket Standard ili viši: na nižem traka se prikazuje, ali ne vraća rezultate.

Dodajte atribut data-replace u script oznaku i traka će zauzeti mjesto one koju vaša tema već ima. Dodajte ga u Site Settings, Custom Code, Footer, na isto mjesto kao i kod chata, čime dolazi neposredno prije zatvarajuće body oznake.

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

Pročitajte cijeli vodič za AI traku za pretraživanje