Kuinka lisätä Asyntai AI Chatbot WordPress-sivustolle

Vaiheittainen opas WordPress-sivustoille

Alusta:

Vaihe 1: Hanki upotuskoodisi

Siirry ensin Asyntai-hallintapaneeliin ja vieritä alas kohtaan "Embed Code". Kopioi yksilöllinen upotuskoodisi, joka näyttää tältä:

<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 ilmainen "WPCode"-lisäosa (aiemmalta nimeltään "Insert Headers and Footers").

Using WPCode (Free)

Siirry WordPressin hallintapaneelissa kohtaan Plugins → Add Plugin
Hae "WPCode" ja asenna se
Aktivoi lisäosa
Siirry kohtaan Code Snippets → Header & Footer
Liitä Asyntai-upotuskoodisi "Footer" -osioon
Napsauta "Save Changes"

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)

Lohkoteemoissa (kuten Twenty Twenty-Four ja muut Full Site Editing -teemat) ei ole footer.php-tiedostoa eikä </body>-tagia teematiedostoissa. Käytä lohkoteeman kanssa 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 Location-arvoksi "<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, jota käytit chat-koodiin, esimerkiksi WPCodella. Skriptin ei tarvitse olla hakukenttäsi lähellä, joten sinun ei tarvitse muokata mitään teematiedostoa.

<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