Kuinka lisätä Asyntai AI Chatbot WordPress-sivustolle

Vaiheittainen opas WordPress-sivustoille

Alusta:

Vaihe 1: Hanki upotuskoodisi

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>

Huomautus: Yllä oleva koodi on vain esimerkki. Sinun on kopioitava oma yksilöllinen upotuskoodisi Hallintapaneelistasi, sillä se sisältää henkilökohtaisen widget-tunnuksesi.

Vaihe 2: Valitse asennustapa

Chat-widgetin voi lisätä WordPressiin useilla tavoilla. Valitse sinulle parhaiten sopiva menetelmä:

Menetelmä 1: Lisäosan käyttö (suositeltu)

Helpoin tapa lisätä chat-widget on käyttää lisäosaa, kuten "Insert Headers and Footers" tai "WPCode".

Using WPCode (Free)

Siirry WordPress-hallinnassa kohtaan Lisäosat → Lisää uusi
Hae "WPCode" ja asenna se
Aktivoi lisäosa
Siirry kohtaan Code Snippets → Header & Footer
Liitä Asyntai-upotuskoodisi "Footer" -osioon
Napsauta "Save Changes"

Insert Headers and Footers -lisäosan käyttö

Siirry WordPress-hallinnassa kohtaan Lisäosat → Lisää uusi
Hae "Insert Headers and Footers" WPBeginneriltä
Asenna ja aktivoi lisäosa
Siirry kohtaan Asetukset → Insert Headers and Footers
Liitä Asyntai-upotuskoodisi "Scripts in Footer" -kenttään
Napsauta "Save"

Miksi käyttää lisäosaa? Lisäosan käyttö varmistaa, että koodisi pysyy paikallaan, vaikka päivittäisit tai vaihtaisit WordPress-teemasi.

Menetelmä 2: Teematiedostojen muokkaus

Voit lisätä koodin suoraan teematiedostoihisi. Teematiedostojen muokkaimen sijainti riippuu WordPress-versiostasi ja teematyypistä.

Klassisille teemoille

Siirry WordPress-hallinnassa kohtaan Ulkoasu → Teematiedostojen muokkain
Valitse aktiivinen teemasi pudotusvalikosta (jos ei ole jo valittuna)
Etsi ja napsauta footer.php oikean puolen tiedostoluettelosta
Vieritä alas ja etsi sulkeva </body>-tagi
Liitä Asyntai-upotuskoodisi juuri ennen </body>-tagia
Napsauta "Update File"

Lohkoteemoille (FSE-teemat)

Jos käytät lohkopohjaista teemaa (kuten Twenty Twenty-Four tai muita Full Site Editing -teemoja), Teematiedostojen muokkain on siirtynyt:

Siirry WordPress-hallinnassa kohtaan Työkalut → Teematiedostojen muokkain
Valitse aktiivinen teemasi pudotusvalikosta
Etsi footer.php tai footer.html tiedostoluettelosta
Lisää Asyntai-upotuskoodisi ennen sulkevaa </body>-tagia
Napsauta "Update File"

Huomautus: Joissain lohkoteemoissa ei ole footer.php-tiedostoa. Käytä siinä tapauksessa lisäosamenetelmää (WPCode), joka toimii kaikkien teematyyppien kanssa.

Tärkeää: Teemapäivitykset ylikirjoittavat muutoksesi. Pysyvää ratkaisua varten käytä lapsiteemaa tai lisäosamenetelmää.

Menetelmä 3: Elementorin käyttö

Jos käytät Elementoria, voit lisätä koodin Elementorin mukautetun koodin ominaisuuden kautta.

Elementor Pro

Siirry kohtaan Elementor → Custom Code
Napsauta "Add New"
Anna sille nimi, kuten "Asyntai Chatbot"
Aseta sijainti kohtaan "Before </body> End"
Liitä Asyntai-upotuskoodisi
Aseta näyttöehdoksi "Entire Site"
Napsauta "Publish"

Elementor Free

Jos käytät Elementorin ilmaisversiota, käytä yllä kuvattua lisäosamenetelmää, sillä mukautetun koodin lisääminen vaatii Elementor Pro -version.

Vaihe 3: Vahvista asennus

Koodin lisäämisen jälkeen vieraile verkkosivustollasi uudessa selaimen välilehdessä tai incognito-ikkunassa. Chat-widgetin painikkeen pitäisi näkyä sivustosi oikeassa alakulmassa. Napsauta sitä varmistaaksesi, että se avautuu ja toimii oikein.

Etkö näe widgetiä? Tyhjennä selaimen välimuisti ja WordPress-välimuistilisäosat. Jos käytät välimuistilisäosaa, kuten WP Rocket tai W3 Total Cache, tyhjennä välimuisti koodin lisäämisen jälkeen.

Tekoälyhakupalkin lisääminen

Tekoälyhakupalkki on erillinen widget omalla koodillaan. Lisää se chatin rinnalle tai yksin. Se vaatii Standard-tilauksen tai korkeamman: alemmassa palkki näkyy mutta ei palauta tuloksia.

Lisää script-tagiin data-replace-attribuutti, niin palkki korvaa teemasi nykyisen palkin. Lisää se samalla ylä- ja alatunnisteen lisäosalla, jolla lisäsit chat-koodin, esimerkiksi Code Snippets tai Insert Headers and Footers. Skriptin ei tarvitse olla hakukentän vieressä, joten sinun ei tarvitse muokata teematiedostoja.

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

Lue tekoälyhakupalkin koko opas

Dokumentaatio