Cum să adăugați Chatbot-ul AI Asyntai în MODX

Ghid pas cu pas pentru site-urile CMS MODX

Platformă:

Pasul 1: Obțineți codul de încorporare

Mai întâi, accesați panoul de control Asyntai și derulați în jos până la secțiunea "Cod de integrare". Copiați codul dvs. unic de integrare, care va arăta astfel:

<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>

Notă: Codul de mai sus este doar un exemplu. Trebuie să copiați propriul cod unic de încorporare din Tabloul de bord, deoarece conține ID-ul personal al widgetului dvs.

Pasul 2: Adăugați în șablonul MODX (Recomandat)

Modul recomandat de a adăuga chatbot-ul este prin editarea directă a șablonului MODX în MODX Manager:

Conectați-vă la MODX Manager (panoul de administrare)
În bara laterală din stânga, mergeți la Elements > Templates
Deschideți șablonul site-ului (denumit de obicei "BaseTemplate" sau șablonul activ)
Găsiți eticheta de închidere </body> în codul șablonului
Lipiți codul de integrare Asyntai chiar înainte de eticheta de închidere </body>
Faceți clic pe "Save" pentru a salva șablonul

<!-- Your existing template content -->

<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>
</body>
</html>

Sfat: Adăugarea codului chiar înainte de eticheta de închidere </body> asigură că chatbot-ul se încarcă după tot conținutul paginii, ceea ce este plasarea recomandată pentru widget-urile de chat și nu va încetini încărcarea paginii.

Metoda alternativă 1: Utilizarea unui Chunk MODX

Puteți folosi un Chunk MODX pentru a păstra codul de încorporare separat și reutilizabil:

În MODX Manager, mergeți la Elements > Chunks
Faceți clic pe "New Chunk" pentru a crea un chunk nou
Denumiți chunk-ul "asyntaiWidget"
Lipiți codul de integrare Asyntai în zona de conținut a chunk-ului
Faceți clic pe "Salvare"
Deschideți șablonul (sub Elements > Templates)
Adăugați apelul chunk-ului [[$asyntaiWidget]] chiar înainte de eticheta de închidere </body>
Salvați șablonul

<!-- In your Template, before </body> -->
[[$asyntaiWidget]]
</body>
</html>

Sfat: Utilizarea unui Chunk facilitează gestionarea și actualizarea codului de integrare într-un singur loc, mai ales dacă utilizați mai multe șabloane pe site.

Metoda alternativă 2: Utilizarea setărilor de sistem MODX (HTML Head/Footer)

Unele configurații MODX includ substituenți pentru scripturi de subsol prin Setările de sistem:

În MODX Manager, mergeți la System > System Settings
Filtrați după "htmlhead" sau căutați o setare de sistem personalizată pentru scripturile de subsol
Dacă configurația dvs. are un substituent pentru scripturile de subsol (cum ar fi [[++footer_scripts]]), îl puteți utiliza
Setați valoarea setării de sistem la codul de integrare Asyntai
Asigurați-vă că substituientul corespunzător [[++footer_scripts]] este prezent în șablonul dvs. înainte de eticheta de închidere </body>
Salvați setarea de sistem

<!-- In your Template, before </body> -->
[[++footer_scripts]]
</body>
</html>

Notă: Această metodă depinde de configurația MODX care are o setare de sistem personalizată pentru scripturile de subsol. Dacă una nu există, puteți crea o setare de sistem personalizată și să o referențiați în șablonul dvs. folosind sintaxa [[++setting_key]].

Metoda alternativă 3: Utilizarea unui plugin MODX (OnWebPagePrerender)

Pentru o abordare avansată, puteți crea un Plugin MODX care injectează automat codul chatbot-ului pe fiecare pagină:

În MODX Manager, mergeți la Elements > Plugins
Faceți clic pe "New Plugin" pentru a crea un plugin nou
Denumiți pluginul "AsyntaiChatbot"
Lipiți următorul cod PHP în zona de cod a pluginului:

$output = &$modx->resource->_output;
$script = '<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>';
$output = str_replace('</body>', $script . '</body>', $output);

Faceți clic pe fila "System Events"
Bifați caseta de lângă "OnWebPagePrerender" pentru a declanșa acest plugin pe acel eveniment
Faceți clic pe "Salvare"

Important: Înlocuiți YOUR_WIDGET_ID cu ID-ul real al widget-ului din Tabloul de bord Asyntai. Acest plugin va injecta automat scriptul chatbot-ului pe fiecare pagină a site-ului MODX înainte de a fi randat.

Pasul 3: Goliți memoria cache și verificați

După adăugarea codului de integrare folosind oricare dintre metodele de mai sus, trebuie să goliți cache-ul MODX și să verificați instalarea:

În MODX Manager, mergeți la Manage > Clear Cache (sau faceți clic pe pictograma de golire cache din meniul de sus)
Deschideți site-ul dvs. într-o filă nouă de browser sau fereastră incognito
Ar trebui să vedeți butonul widget-ului de chat în colțul din dreapta jos al paginii
Faceți clic pe el pentru a vă asigura că se deschide și funcționează corect

Nu vedeți widgetul? Asigurați-vă că ați golit cache-ul MODX din Manage > Clear Cache în MODX Manager. De asemenea, încercați să goliți cache-ul browserului sau să vizualizați site-ul într-o fereastră incognito. Dacă ați folosit metoda Plugin, verificați că evenimentul de sistem "OnWebPagePrerender" este bifat pentru pluginul dvs.