Hoe u de Asyntai AI-chatbot toevoegt aan Craft CMS

Stapsgewijze handleiding voor Craft CMS-websites

Platform:

Stap 1: Uw insluitcode ophalen

Ga eerst naar uw Asyntai Dashboard en scroll naar het gedeelte "Insluitcode". Kopieer uw unieke insluitcode die er als volgt uitziet:

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

Opmerking: De bovenstaande code is slechts een voorbeeld. U moet uw eigen unieke insluitcode kopiëren vanuit uw Dashboard omdat deze uw persoonlijke widget-ID bevat.

Stap 2: Uw lay-outtemplate bewerken (aanbevolen)

De eenvoudigste manier om de chatbot aan alle pagina's toe te voegen is door uw hoofdlay-outtemplate te bewerken:

Ga naar uw Craft CMS-projectbestanden via FTP, SSH of uw code-editor
Navigeer naar de map templates/
Zoek uw hoofdlay-outbestand (meestal genaamd _layout.twig, _layout.html, of te vinden in templates/_layouts/)
Zoek de afsluitende </body>-tag
Plak uw Asyntai-insluitcode net vóór de </body>-tag
Sla het bestand op

Tip: Het toevoegen van het script vóór de afsluitende </body>-tag zorgt ervoor dat het na de pagina-inhoud wordt geladen, wat aanbevolen is voor chatwidgets en het laden van uw pagina niet vertraagt.

Alternative: Using Twig {% js %} Tag (Craft CMS 3.x+)

Craft CMS provides a built-in Twig tag for registering JavaScript:

Open uw hoofdlay-outtemplate
Voeg de volgende code toe vóór de afsluitende </body>-tag:
{% js %} (function() { var script = document.createElement('script'); script.async = true; script.src = 'https://asyntai.com/static/js/chat-widget.js'; script.setAttribute('data-asyntai-id', 'YOUR_WIDGET_ID'); document.body.appendChild(script); })(); {% endjs %}
Vervang YOUR_WIDGET_ID door uw werkelijke widget-ID
Sla het bestand op

Opmerking: The {% js %} tag automatically handles script registration and prevents duplicate loading if the same code appears multiple times.

Alternatief: Een apart include-bestand maken

Maak voor een betere organisatie een speciaal include-bestand aan:

Maak een nieuw bestand aan: templates/_includes/chatbot.twig (of .html)
Voeg uw Asyntai-insluitcode toe aan dit bestand:
<script async src="https://asyntai.com/static/js/chat-widget.js" data-asyntai-id="YOUR_WIDGET_ID"></script>
Neem in uw hoofdlay-outtemplate dit bestand op vóór </body>:
{% include '_includes/chatbot' %}
Sla beide bestanden op

Tip: Het gebruik van een include-bestand maakt het eenvoudig om de chatbot op uw gehele site in of uit te schakelen door één enkele regel uit te commentariëren.

Alternatief: Voorwaardelijk laden

Om de chatbot alleen op specifieke pagina's of secties te laden:

Gebruik in uw lay-out- of paginatemplate Twig-conditionals:
{% if entry.showChatbot ?? true %} <script async src="https://asyntai.com/static/js/chat-widget.js" data-asyntai-id="YOUR_WIDGET_ID"></script> {% endif %}
Of controleer op specifieke secties:
{% if craft.app.request.segments[0] != 'admin' %} <script async src="https://asyntai.com/static/js/chat-widget.js" data-asyntai-id="YOUR_WIDGET_ID"></script> {% endif %}

Stap 3: Installatie verifiëren

Bezoek na het opslaan van uw wijzigingen uw Craft CMS-website in een nieuw browsertabblad of incognitovenster. U zou de chatwidgetknop in de rechteronderhoek moeten zien. Klik erop om te controleren of deze correct opent en werkt.

Ziet u de widget niet? Zorg ervoor dat u het templatebestand hebt opgeslagen en dat u het juiste lay-outtemplate bewerkt dat uw pagina's gebruiken. Wis uw browsercache of bekijk in een incognitovenster. Als u templatecaching gebruikt, wis dan de Craft CMS-cache vanuit het Configuratiescherm onder Utilities > Clear Caches.

Templatelocatie: De templatelocaties van Craft CMS kunnen variëren afhankelijk van uw projectconfiguratie. Veelvoorkomende locaties zijn templates/_layout.twig, templates/_layouts/main.twig of templates/_base.twig. Controleer uw bestaande templates om te vinden waar de </body>-tag is gedefinieerd.