Asyntai AI -chatbotin lisääminen Kirbyyn

Vaiheittainen opas Kirby CMS -verkkosivustoille

Alusta:

Vaihe 1: Hanki upotuskoodisi

Siirry ensin Asyntai-hallintapaneeliin ja vieritä alas "Upotuskoodi"-osioon. Kopioi yksilöllinen upotuskoodisi, joka näyttää tältä:

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

Huomautus: Yllä oleva koodi on vain esimerkki. Sinun on kopioitava oma yksilöllinen upotuskoodisi Hallintapaneelistasi, sillä se sisältää henkilökohtaisen widget-tunnuksesi.

Vaihe 2: Lisääminen Kirby-katkelmaan (suositeltu)

Kirby on tiedostopohjainen PHP-sisällönhallintajärjestelmä, joka käyttää katkelmia uudelleenkäytettäviin templaattiosiin. Suositeltu tapa on luoda chatbotille oma katkelma:

Luo uusi katkelmatiedosto sijaintiin site/snippets/asyntai-widget.php
Liitä upotuskoodisi tiedostoon:

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

Sisällytä sitten katkelma päätemplaattiisi (esim. site/templates/default.php) tai asetteluusi juuri ennen sulkevaa </body>-tagia:

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

Vinkki: Jos käytät jaettua asettelua tai alatunnistekatkelmaa, voit lisätä katkelmakutsun sinne, jolloin se näkyy automaattisesti jokaisella sivulla. Lisää se esimerkiksi alatunnistekatkelmaan juuri ennen </body>-tagia.

Vaihtoehtoinen menetelmä 1: Lisääminen alatunnistekatkelmaan

Jos Kirby-sivustosi käyttää alatunnistekatkelmaa, voit lisätä upotuskoodin suoraan sinne:

Avaa site/snippets/footer.php (luo se, jos sitä ei ole)
Lisää upotuskoodi ennen sulkevaa </body>-tagia:

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

Varmista, että templaattisi sisältävät alatunnistekatkelman:

<?php snippet('footer') ?>

Huomautus: Jos alatunnistekatkelma on jo sisällytetty kaikkiin templaatteihisi, chatbotin lisääminen tänne varmistaa, että se näkyy jokaisella sivulla ilman yksittäisten templaattitiedostojen muokkaamista.

Vaihtoehtoinen menetelmä 2: Kirby-lisäosan käyttö

Voit luoda Kirby-lisäosan chatbot-skriptin automaattiseen lisäämiseen jokaiselle sivulle ilman templaattien muokkausta:

Luo lisäosan hakemisto ja tiedosto sijaintiin site/plugins/asyntai/index.php
Lisää seuraava koodi käyttääksesi Kirbyn koukkuja skriptin lisäämiseen:

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);
        }
    ]
]);

Vinkki: Lisäosalähestymistapa on ihanteellinen, jos haluat chatbotin latautuvan automaattisesti jokaisella sivulla ilman templaatti- tai katkelmatiedostojen muokkausta. Se pitää chatbot-integraation myös modulaarisena ja helposti kytkettävänä päälle tai pois.

Vaihtoehtoinen menetelmä 3: Kirbyn js()-apufunktion käyttö

Kirby tarjoaa sisäänrakennetun js()-apufunktion JavaScript-tiedostojen lataamiseen. Voit käyttää sitä templaatissasi tai katkelmassasi:

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

Tai lisää skripti suoraan templaatin PHP-tiedostoon ennen </body>-tagia:

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

Huomautus: Jos käytät js()-apufunktiota, varmista, että se on sijoitettu templaattisi <body>-osion sisälle chatbotin oikean latautumisen varmistamiseksi.

Vaihe 3: Vahvista asennus

Upotuskoodin lisäämisen jälkeen Kirby-sivustollesi avaa verkkosivustosi uudessa selainvälilehdessä tai incognito-ikkunassa. Chat-widget-painikkeen pitäisi näkyä oikeassa alakulmassa. Napsauta sitä varmistaaksesi, että se avautuu ja toimii oikein.

Etkö näe widgetiä? Varmista, että korvasit YOUR_WIDGET_ID todellisella widget-tunnisteellasi hallintapaneelista. Tarkista, että katkelma- tai lisäosatiedosto on tallennettu oikeaan hakemistoon. Jos käytät lisäosamenetelmää, varmista, että lisäosan hakemistorakenne on site/plugins/asyntai/index.php. Tyhjennä selaimen välimuisti tai testaa incognito-tilassa. Tarkista selaimen kehittäjäkonsoli (F12) mahdollisten virheiden varalta.