Kako dodati Asyntai AI chatbot na WordPress
Vodič korak po korak za WordPress web stranice
Korak 1: Nabavite svoj kod za ugradnju
Najprije idite na svoju Asyntai nadzornu ploču i pomaknite se prema dolje do odjeljka "Embed Code". Kopirajte svoj jedinstveni kod za ugradnju koji će izgledati ovako:
<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: Odaberite metodu instalacije
Postoji nekoliko načina za dodavanje chat widgeta na WordPress. Odaberite metodu koja vam najbolje odgovara:
Metoda 1: Korištenje dodatka (preporučeno)
Najlakši način za dodavanje chat widgeta je besplatni dodatak "WPCode" (prije nazvan "Insert Headers and Footers").
Korištenje WPCode (Free)
- Idite na Plugins → Add Plugin u WordPress administratorskom sučelju
- Potražite "WPCode" i instalirajte ga
- Aktivirajte dodatak
- Idite na Code Snippets → Header & Footer
- Zalijepite svoj Asyntai ugradbeni kod u odjeljak "Footer"
- Kliknite "Save Changes"
Zašto koristiti dodatak? Korištenje dodatka osigurava da vaš kod ostane na mjestu čak i kada ažurirate ili promijenite svoju WordPress temu.
Metoda 2: Uređivanje datoteka teme
Možete dodati kod izravno u datoteke teme. Lokacija uređivača datoteka teme ovisi o vašoj verziji WordPressa i vrsti teme.
Za klasične teme
- Idite na Izgled → Uređivač datoteka teme u WordPress administratorskom sučelju
- Odaberite svoju aktivnu temu iz padajućeg izbornika (ako već nije odabrana)
- Pronađite i kliknite na footer.php u popisu datoteka s desne strane
- Pomaknite se do dna i pronađite završnu
</body>oznaku - Zalijepite svoj Asyntai kod za ugradnju neposredno prije oznake
</body> - Kliknite "Update File"
Za blok teme (FSE teme)
Blok teme (poput Twenty Twenty-Four i drugih tema za Full Site Editing) nemaju datoteku footer.php ni oznaku </body> u svojim datotekama teme. Za blok temu koristite metodu s dodatkom (WPCode), koja radi sa svim vrstama tema.
Važno: Ažuriranja teme prebrisat će vaše promjene. Za trajno rješenje koristite podređenu temu ili metodu s dodatkom.
Metoda 3: Korištenje Elementora
Ako koristite Elementor, možete dodati kod putem Elementorove značajke za prilagođeni kod.
Elementor Pro
- Idite na Elementor → Custom Code
- Kliknite "Add New"
- Dajte mu naziv poput "Asyntai Chatbot"
- Postavite Location na "<body> – End"
- Zalijepite svoj Asyntai kod za ugradnju
- Postavite uvjete prikaza na "Entire Site"
- Kliknite "Publish"
Elementor Free
Ako koristite besplatnu verziju Elementora, koristite gore opisanu metodu s dodatkom, jer umetanje prilagođenog koda zahtijeva Elementor Pro.
Korak 3: Provjerite instalaciju
Nakon dodavanja koda posjetite svoju web stranicu u novoj kartici preglednika ili anonimnom prozoru. Trebali biste vidjeti gumb chat widgeta u donjem desnom kutu stranice. Kliknite na njega kako biste provjerili otvara li se i radi li ispravno.
Ne vidite widget? Očistite predmemoriju preglednika i sve WordPress dodatke za predmemoriju. Ako koristite dodatak za predmemoriju poput WP Rocket ili W3 Total Cache, očistite predmemoriju nakon dodavanja koda.
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 oznaku script i traka će zamijeniti onu koju vaša tema već ima. Dodajte je pomoću istog dodatka za zaglavlje i podnožje koji ste koristili za chat kod, na primjer WPCode. Skripta ne mora biti blizu vašeg okvira za pretraživanje, pa ne morate uređivati nijednu datoteku teme.
<script src="https://widget.asyntai.com/static/js/search-widget.js" data-asyntai-id="YOUR_WIDGET_ID" data-replace="auto" async></script>
Weebly