Hoe voegt u de Asyntai AI-chatbot toe aan Kirby

Stapsgewijze handleiding voor Kirby 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: Toevoegen aan Kirby-snippet (aanbevolen)

Kirby is een flat-file PHP CMS dat snippets gebruikt voor herbruikbare templateonderdelen. De aanbevolen aanpak is om een speciale snippet voor de chatbot aan te maken:

Maak een nieuw snippetbestand aan op site/snippets/asyntai-widget.php
Plak uw insluitcode in het bestand:

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

Voeg vervolgens de snippet toe in uw hoofdtemplate (bijv. site/templates/default.php) of uw layout, net voor de afsluitende </body>-tag:

<?php snippet('asyntai-widget') ?>
</body>
</html>

Tip: Als u een gedeelde layout of footer-snippet gebruikt, kunt u de snippet-aanroep daar toevoegen zodat deze automatisch op elke pagina verschijnt. Voeg deze bijvoorbeeld toe aan uw footer-snippet net voor </body>.

Alternatieve methode 1: Toevoegen aan footer-snippet

Als uw Kirby-site een footer-snippet gebruikt, kunt u de insluitcode daar direct toevoegen:

Open site/snippets/footer.php (maak het aan als het niet bestaat)
Voeg de insluitcode toe v\u00f3\u00f3r de afsluitende </body>-tag:

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

Zorg ervoor dat uw templates de footer-snippet bevatten:

<?php snippet('footer') ?>

Opmerking: Als de footer-snippet al in al uw templates is opgenomen, zorgt het toevoegen van de chatbot hier ervoor dat deze op elke pagina verschijnt zonder individuele templatebestanden te wijzigen.

Alternatieve methode 2: Kirby-plugin gebruiken

U kunt een Kirby-plugin maken om het chatbotscript automatisch op elke pagina te injecteren zonder templates te wijzigen:

Maak de pluginmap en het bestand aan op site/plugins/asyntai/index.php
Voeg de volgende code toe om Kirby's hooks te gebruiken om het script te injecteren:

Kirby::plugin('custom/asyntai', [
    'hooks' => [
        'page.render:after' => function ($contentType, $body) {
            $script = '<script async src="https://asyntai.com/static/js/chat-widget.js" data-asyntai-id="YOUR_WIDGET_ID"></script>';
            return str_replace('</body>', $script . '</body>', $body);
        }
    ]
]);

Tip: De pluginaanpak is ideaal als u wilt dat de chatbot automatisch op elke pagina wordt geladen zonder template- of snippetbestanden te bewerken. Het houdt uw chatbotintegratie ook modulair en eenvoudig in of uit te schakelen.

Alternatieve methode 3: De js()-helper van Kirby gebruiken

Kirby biedt een ingebouwde js()-helper voor het laden van JavaScript-bestanden. U kunt deze gebruiken in uw template of snippet:

<?= js('https://asyntai.com/static/js/chat-widget.js', ['async' => true, 'data-asyntai-id' => 'YOUR_WIDGET_ID']) ?>

Of voeg het script direct toe in uw template-PHP-bestand voor </body>:

<?php // site/templates/default.php ?>
<html>
<head>
    <!-- head content -->
</head>
<body>
    <!-- page content -->
    <?php snippet('header') ?>
    <main>
        <?= $page->text()->kirbytext() ?>
    </main>
    <?php snippet('footer') ?>

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

Opmerking: Als u de js()-helper gebruikt, zorg er dan voor dat deze binnen de <body>-sectie van uw template is geplaatst om te garanderen dat de chatbot correct wordt geladen.

Stap 3: Installatie verifiëren

Bezoek na het toevoegen van de insluitcode aan uw Kirby-site uw website in een nieuw browsertabblad of incognitovenster. U zou de chatwidgetknop rechtsonder in de hoek moeten zien. Klik erop om te controleren of deze correct opent en werkt.

Ziet u de widget niet? Zorg ervoor dat u YOUR_WIDGET_ID hebt vervangen door uw daadwerkelijke widget-ID uit het dashboard. Controleer of het snippet- of pluginbestand in de juiste map is opgeslagen. Als u de pluginmethode gebruikt, zorg er dan voor dat de mapstructuur van de plugin site/plugins/asyntai/index.php is. Wis uw browsercache of test in incognitomodus. Controleer de ontwikkelaarsconsole van uw browser (F12) op fouten.