Kaip pridėti Asyntai DI pokalbių robotą prie Grav

Žingsnis po žingsnio vadovas Grav 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ėkite prie Grav temos šablono (Rekomenduojama)

Geriausias būdas pridėti pokalbių robotą prie visų Grav svetainės puslapių yra redaguoti temos bazinį Twig šabloną:

Eikite į Grav projekto user/themes/yourtheme/templates/ katalogą ir atidarykite default.html.twig (arba temos naudojamą bazinį šabloną)
Pridėkite savo Asyntai įterpimo kodą prieš uždaromąjį </body> žymą:

<!-- user/themes/yourtheme/templates/default.html.twig -->
...
    <script async src="https://asyntai.com/static/js/chat-widget.js" data-asyntai-id="YOUR_WIDGET_ID"></script>
  </body>
</html>

Išsaugokite failą

Patarimas: Grav naudoja Twig kaip šablonų variklį. Bazinis šablonas paprastai yra default.html.twig arba partials/base.html.twig priklausomai nuo temos. Patikrinkite temos struktūrą, kad rastumėte teisingą failą su </body> uždaromuoju žymu.

Alternatyvus metodas 1: Grav išteklių tvarkyklės naudojimas

Grav integruota išteklių tvarkyklė suteikia švarų būdą pridėti JavaScript išteklius per Twig:

Atidarykite temos bazinį Twig šabloną (pvz., user/themes/yourtheme/templates/partials/base.html.twig)
Naudokite išteklių tvarkyklę JavaScript pridėjimui:

{% do assets.addJs('https://asyntai.com/static/js/chat-widget.js', {group: 'bottom', loading: 'async', 'data-asyntai-id': 'YOUR_WIDGET_ID'}) %}

Arba pridėkite eilutinį JavaScript, kad dinamiškai sukurtumėte skripto elementą baziniame šablone:

<!-- user/themes/yourtheme/templates/partials/base.html.twig -->
...
{% block bottom %}
    {{ assets.js('bottom') }}
{% endblock %}

<script>
(function() {
  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.body.appendChild(script);
})();
</script>
</body>
</html>

Pastaba: Išteklių tvarkyklės metodas yra Grav rekomenduojamas būdas JavaScript ištekliams valdyti. Jis teikia integruotą palaikymą išteklių konvejeriui, rikiavimui ir grupavimui.

Alternatyvus metodas 2: Custom JS papildinio naudojimas

Jei norite papildiniu pagrįsto būdo neredaguojant temos failų:

Įdiekite „Custom JS“ papildinį per Grav administravimo skydelį arba per CLI:

bin/gpm install custom-js

Eikite į Administravimas > Papildiniai > Custom JS
Pridėkite įterpimo skripto kodą:

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

Išsaugokite papildinio konfigūraciją

Patarimas: Papildinio naudojimas skriptams įterpti reiškia, kad nereikia modifikuoti jokių temos failų. Tai palengvina temų keitimą ar atnaujinimą neprarandant pokalbių roboto integracijos.

Alternatyvus metodas 3: Bloko perrašymas antriniame šablone

Jei jūsų Grav tema naudoja Twig blokų paveldėjimą, galite perrašyti apatinį bloką antriniame šablone:

{% block bottom %}
    {{ parent() }}
    <script async src="https://asyntai.com/static/js/chat-widget.js" data-asyntai-id="YOUR_WIDGET_ID"></script>
{% endblock %}

Sukurkite arba atidarykite vaikinį šabloną, kuris išplečia jūsų temos bazinį šabloną
Pridėkite aukščiau parodytą bloko perrašymą
parent() iškvietimas užtikrina, kad visas esamas bloko turinys būtų išsaugotas

Pastaba: Šis metodas naudoja Twig šablonų paveldėjimo sistemą. Įsitikinkite, kad bloko pavadinimas (pvz., bottom) atitinka temos baziniame šablone apibrėžtą bloką. Dažni blokų pavadinimai yra bottom, javascripts arba footer.

Alternatyvus metodas 4: Grav Custom Head papildinio naudojimas

Kita papildiniu pagrįsta parinktis yra Custom Head papildinys:

Įdiekite custom-head papildinį per CLI arba administravimo skydelį:

bin/gpm install custom-head

Eikite į Administravimas > Papildiniai > Custom Head
Pridėkite savo Asyntai įterpimo skripto kodą papildinio konfigūracijoje:

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

Išsaugokite konfigūraciją

Patarimas: Custom Head papildinys leidžia įterpti kodą į svetainės antraštės ar turinio skyrius neliečiant temos failų. Patikrinkite papildinio dokumentaciją dėl teisingos vietos parinkties, kad įterptumėte skriptą prieš uždaromąjį </body> žymą.

3 žingsnis: Išvalykite talpyklą ir patikrinkite

Pridėję kodą, išvalykite Grav talpyklą ir patikrinkite diegimą:

# Clear cache via CLI
bin/grav clearcache

# Or clear cache from Admin Panel:
# Admin > Tools > Clear Cache

Atidarykite Grav 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 Grav talpyklą su bin/grav clearcache arba iš administravimo skydelio. Patikrinkite, ar 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) ir patikrinkite, ar nėra JavaScript klaidų. Patikrinkite, ar skriptas yra puslapio šaltinyje, dešiniuoju pelės mygtuku spustelėdami ir pasirinkdami "Peržiūrėti puslapio šaltinį".

Dokumentacija

Kaip pridėti Asyntai DI pokalbių robotą prie Grav

1 žingsnis: Gaukite savo įterpimo kodą

2 žingsnis: Pridėkite prie Grav temos šablono (Rekomenduojama)

Alternatyvus metodas 1: Grav išteklių tvarkyklės naudojimas

Alternatyvus metodas 2: Custom JS papildinio naudojimas

Alternatyvus metodas 3: Bloko perrašymas antriniame šablone

Alternatyvus metodas 4: Grav Custom Head papildinio naudojimas

3 žingsnis: Išvalykite talpyklą ir patikrinkite