Kaip pridėti Asyntai AI pokalbių robotą prie SilverStripe

Žingsnis po žingsnio vadovas SilverStripe CMS

Platforma:

1 žingsnis: Gaukite savo įterpimo kodą

Pirma, eikite į savo Asyntai valdymo skydelį ir slinkite žemyn iki "Įterpimo kodas" skyriaus. Nukopijuokite savo unikalų įterpimo kodą, kuris atrodys taip:

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

Pastaba: Aukščiau pateiktas kodas yra tik pavyzdys. Turite nukopijuoti savo unikalų įterpimo kodą iš savo Valdymo skydelio, nes jame yra jūsų asmeninis valdiklio ID.

2 žingsnis: Pridėjimas prie SilverStripe šablono (rekomenduojama)

Paprasčiausias būdas pridėti pokalbių robotą prie SilverStripe svetainės yra tiesiogiai redaguoti pagrindinį temos šablono failą:

Atidarykite savo temos šablono failą (pvz., themes/yourtheme/templates/Page.ss)
Pridėkite įterpimo kodą prieš pat uždaromąjį </body> žymą:

    <script async src="https://asyntai.com/static/js/chat-widget.js" data-asyntai-id="YOUR_WIDGET_ID"></script>
  </body>
</html>

Išsaugokite failą ir išvalykite SilverStripe talpyklą pridėdami ?flush=1 prie savo svetainės URL

Patarimas: SilverStripe naudoja .ss šablonų failus su šablonų paveldėjimo sistema. Scenarijaus patalpinimas baziniame Page.ss šablone užtikrina, kad pokalbių robotas bus rodomas kiekviename jūsų svetainės puslapyje. Jei jūsų tema naudoja Includes aplanką, taip pat galite patalpinti scenarijų bendrame įtraukimo faile.

Alternatyvus metodas 1: Requirements klasės naudojimas valdiklyje

SilverStripe suteikia Requirements klasę JavaScript ir CSS priklausomybėms valdyti programiškai. Tai rekomenduojamas metodas kūrėjams:

Atidarykite app/src/PageController.php (arba savo puslapio valdiklio failą)
init() metode naudokite Requirements::customScript(), kad dinamiškai įkeltumėte valdiklį:

use SilverStripe\View\Requirements;

class PageController extends \SilverStripe\CMS\Controllers\ContentController
{
    protected function init()
    {
        parent::init();
        Requirements::customScript(<<<JS
            var script = document.createElement('script');
            script.src = 'https://asyntai.com/static/js/chat-widget.js';
            script.setAttribute('data-asyntai-id', 'YOUR_WIDGET_ID');
            script.async = true;
            document.head.appendChild(script);
        JS);
    }
}

Išsaugokite failą ir išvalykite talpyklą aplankydami yourdomain.com?flush=1

Pastaba: Requirements klasė yra standartinis SilverStripe būdas įtraukti scenarijus ir stilių lapus. Requirements::customScript() naudojimas išveda tiesioginį JavaScript. Šis metodas užtikrina, kad valdiklis bus įkeltas kiekviename puslapyje, valdomame jūsų PageController.

Alternatyvus metodas 2: Requirements naudojimas šablone

Taip pat galite naudoti SilverStripe šablono sintaksę JavaScript failams reikalauti tiesiogiai savo .ss šablone:

Atidarykite savo temos šablono failą (pvz., themes/yourtheme/templates/Page.ss)
Pridėkite šį kodą netoli šablono apačios, prieš </body>:

<% require javascript("https://asyntai.com/static/js/chat-widget.js") %>
<script>
    document.addEventListener('DOMContentLoaded', function() {
        var scripts = document.querySelectorAll('script[src*="chat-widget.js"]');
        scripts.forEach(function(s) {
            s.setAttribute('data-asyntai-id', 'YOUR_WIDGET_ID');
        });
    });
</script>
</body>

Patarimas: <% require %> sintaksė yra SilverStripe šablono lygio būdas įtraukti išteklius. Atkreipkite dėmesį, kad šis metodas natūraliai nepalaiko individualių duomenų atributų pridėjimo prie script žymos, todėl pridedame nedidelį inicializavimo fragmentą valdiklio ID nustatymui.

Alternatyvus metodas 3: SilverStripe konfigūracijos (YAML) naudojimas

Konfigūracija pagrįstam metodui galite naudoti SilverStripe YAML konfigūraciją globaliems reikalavimams pridėti:

Atidarykite arba sukurkite failą app/_config/app.yml
Pridėkite konfigūraciją valdikliui įtraukti per individualų plėtinį arba valdiklio nustatymą:

# app/_config/app.yml
---
Name: asyntai-chatbot
After: '#rootroutes'
---
SilverStripe\Core\Injector\Injector:
  AsyntaiChatbotExtension:
    class: App\Extensions\AsyntaiChatbotExtension

Sukurkite plėtinio failą app/src/Extensions/AsyntaiChatbotExtension.php:

namespace App\Extensions;

use SilverStripe\Core\Extension;
use SilverStripe\View\Requirements;

class AsyntaiChatbotExtension extends Extension
{
    public function onAfterInit()
    {
        Requirements::customScript("
            var script = document.createElement('script');
            script.src = 'https://asyntai.com/static/js/chat-widget.js';
            script.setAttribute('data-asyntai-id', 'YOUR_WIDGET_ID');
            script.async = true;
            document.head.appendChild(script);
        ");
    }
}

Pritaikykite plėtinį savo PageController faile app/_config/app.yml:

PageController:
  extensions:
    - App\Extensions\AsyntaiChatbotExtension

Paleiskite ?flush=1, kad perstatytumėte konfigūracijos talpyklą

Pastaba: YAML konfigūracijos ir plėtinių naudojimas yra moduliškiausias SilverStripe metodas. Jis laiko jūsų pokalbių roboto integraciją atskirai nuo pagrindinės valdiklio logikos ir palengvina įjungimą ar išjungimą nekeičiant kodo.

3 žingsnis: Patikrinkite diegimą

Pridėję kodą ir išvalę SilverStripe talpyklą, atidarykite savo svetainę naujame naršyklės skirtuke. Turėtumėte matyti pokalbių valdiklio mygtuką apatiniame dešiniajame kampe. Spustelėkite jį, kad įsitikintumėte, jog jis atsidaro ir veikia teisingai.

Nematote valdiklio? Įsitikinkite, kad išvalėte talpyklą pridėdami ?flush=1 prie savo svetainės URL. Patikrinkite, kad pakeitėte YOUR_WIDGET_ID savo tikruoju valdiklio ID iš valdymo skydelio. Išvalykite naršyklės talpyklą arba peržiūrėkite inkognito režimu. Atidarykite naršyklės konsolę (F12), kad patikrintumėte JavaScript klaidas. Jei naudojate Requirements klasę, patikrinkite, ar jūsų PageController init() metodas iškviečiamas teisingai.