Az Asyntai AI Chatbot hozzáadása a Kirby-hoz

Lépésről lépésre útmutató Kirby CMS weboldalakhoz

Platform:

1. lépés: Szerezze be a beágyazási kódját

Először lépjen az Asyntai Irányítópultra és görgessen le a „Beágyazási kód" szekcióhoz. Másolja le az egyedi beágyazási kódját, amely így fog kinézni:

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

Megjegyzés: A fenti kód csak egy példa. Le kell másolnia saját egyedi beágyazási kódját az Irányítópultról, mivel az tartalmazza személyes widget-azonosítóját.

2. lépés: Hozzáadás Kirby snippet-hez (ajánlott)

A Kirby egy sík fájl PHP CMS, amely snippet-eket használ újrafelhasználható sablon részekhez. Az ajánlott megközelítés egy dedikált snippet létrehozása a chatbot számára:

Hozzon létre egy új snippet fájlt a site/snippets/asyntai-widget.php helyen
Illessze be a beágyazási kódot a fájlba:

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

Ezután foglalja bele a snippet-et a fő sablonba (pl. site/templates/default.php) vagy az elrendezésbe, közvetlenül a záró </body> tag elé:

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

Tipp: Ha megosztott elrendezést vagy lábléc snippet-et használ, ott adhatja hozzá a snippet hívást, hogy automatikusan megjelenjen minden oldalon. Például adja hozzá a lábléc snippet-éhez közvetlenül a </body> elé.

1. alternatív módszer: Hozzáadás a lábléc snippet-hez

Ha a Kirby webhely lábléc snippet-et használ, közvetlenül ott adhatja hozzá a beágyazási kódot:

Nyissa meg a site/snippets/footer.php fájlt (hozza létre, ha nem létezik)
Adja hozzá a beágyazási kódot a záró </body> tag elé:

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

Győződjön meg arról, hogy a sablonok tartalmazzák a lábléc snippet-et:

<?php snippet('footer') ?>

Megjegyzés: Ha a lábléc snippet már szerepel az összes sablonjában, a chatbot itt való hozzáadása biztosítja, hogy minden oldalon megjelenjen anélkül, hogy módosítani kellene az egyes sablonfájlokat.

2. alternatív módszer: Kirby bővítmény használata

Létrehozhat egy Kirby bővítményt a chatbot script automatikus injektálásához minden oldalra sablonok módosítása nélkül:

Hozza létre a bővítmény könyvtárat és fájlt a site/plugins/asyntai/index.php helyen
Adja hozzá a következő kódot a szkript dinamikus befecskendezéséhez:

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

Tipp: A bővítmény megközelítés ideális, ha azt szeretné, hogy a chatbot automatikusan betöltődjön minden oldalon sablonok vagy snippet fájlok szerkesztése nélkül. Emellett modulárissá teszi és könnyen engedélyezhetővé vagy letilthatóvá a chatbot integrációt.

3. alternatív módszer: A Kirby js() segítő használata

A Kirby beépített js() segítőt biztosít JavaScript fájlok betöltéséhez. Ezt használhatja a sablonban vagy snippet-ben:

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

Vagy adja hozzá a scriptet közvetlenül a sablon PHP fájlban a </body> elé:

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

Megjegyzés: Ha a js() segítőt használja, győződjön meg arról, hogy a sablon <body> részébe helyezi a chatbot helyes betöltésének biztosításához.

3. lépés: Telepítés ellenőrzése

A beágyazási kód Kirby weboldalhoz való hozzáadása után látogassa meg weboldalát egy új böngészőlapon vagy inkognító ablakban. Látnia kell a chat widget gombot a jobb alsó sarokban. Kattintson rá, hogy meggyőződjön arról, hogy megfelelően nyílik meg és működik.

Nem látja a widgetet? Győződjön meg arról, hogy a YOUR_WIDGET_ID értéket a tényleges widget-azonosítójára cserélte az irányítópultról. Ellenőrizze, hogy a snippet vagy bővítmény fájl a megfelelő könyvtárban van-e mentve. A bővítmény módszer használatakor győződjön meg arról, hogy a bővítmény könyvtárstruktúrája site/plugins/asyntai/index.php. Törölje a böngésző gyorsítótárát, vagy tesztelje inkognító módban. Ellenőrizze a böngésző fejlesztői konzolját (F12) a hibák azonosításához.