Jak dodać chatbota Asyntai AI do ProcessWire

Instrukcja krok po kroku dla stron ProcessWire CMS

Platforma:

Krok 1: Pobierz swój kod osadzania

Najpierw przejdź do swojego Panelu Asyntai i przewiń w dół do sekcji "Kod osadzania". Skopiuj swój unikalny kod osadzania, który będzie wyglądał tak:

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

Uwaga: Powyższy kod to tylko przykład. Musisz skopiować swój własny unikalny kod osadzania z Panelu, ponieważ zawiera on Twój osobisty identyfikator widgetu.

Krok 2: Dodaj do pliku szablonu (zalecane)

ProcessWire używa plików szablonów PHP znajdujacych sie w katalogu site/templates/. Najłatwiejszym podejsciem jest dodanie kodu osadzania bezpośrednio do głównego pliku szablonu:

Uzyskaj dostęp do plików instalacji ProcessWire przez FTP, SSH lub menedżera plików
Przejdź do site/templates/
Otwórz główny plik szablonu — najczęściej jest to _main.php lub basic-page.php w zależności od profilu strony
Jeśli używasz strategii opoznionego wyjscia (domyslnej dla większości profili stron), otwórz _main.php
Znajdź zamykający znacznik </body>
Wklej kod osadzania Asyntai tuż przed nim:

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

Wskazówka: Umieszczenie skryptu tuz przed zamykającym znacznikiem </body> zapewnia, ze chatbot załaduje sie po zawartości strony, co jest zalecane dla optymalnej wydajności i nie spowolni renderowania strony.

Metoda alternatywna 1: Użycie pliku dołączanego _foot.inc lub _main.php

Jeśli Twoja strona ProcessWire korzysta z podejścia z plikiem dolaczanym (powszechne w wielu profilach stron), możesz dodać kod osadzania do wspolnego dolaczenia stopki:

Przejdź do site/templates/
Otwórz _foot.inc (lub rownowazny plik dolaczenia stopki)
Wklej swoj kod osadzania Asyntai tuz przed zamykającym tagiem </body>
Zapisz plik

Strategia opoznionego wyjscia ProcessWire zazwyczaj działa z trzema kluczowymi plikami:

_init.php — uruchamiany przed każdym szablonem, inicjalizuje zmienne
Twój plik szablonu (np. basic-page.php) — wypelnia zmienne trescia
_main.php — generuje koncowy kod HTML przy uzyciu tych zmiennych

Jeśli Twoja strona korzysta z tego podejścia, dodanie skryptu do _main.php przed </body> zapewnia jego wyświetlanie na każdej stronie.

Uwaga: Nazwy plików _init.php i _main.php sa skonfigurowane w pliku site/config.php za pomocą ustawień $config->prependTemplateFile i $config->appendTemplateFile. Sprawdź swoja konfigurację, jeśli Twoje pliki maja inne nazwy.

Metoda alternatywna 2: Użycie tablicy $config->scripts

ProcessWire udostępnia tablice FilenameArray $config->scripts, której możesz użyć do zarządzania plikami JavaScript. W pliku _init.php lub w indywidualnym pliku szablonu dodaj:

<?php
$config->scripts->add('https://asyntai.com/static/js/chat-widget.js');
?>

Następnie w pliku _main.php (lub dolaczeniu stopki) przejdź petla przez tablice skryptów, aby je wyświetlić:

<?php foreach($config->scripts as $file): ?>
<script src="<?php echo $file; ?>"></script>
<?php endforeach; ?>

Ważne: Podejście z $config->scripts obsługuje atrybut src skryptu, ale atrybut data-asyntai-id musi byc obsługiwany oddzielnie. Należy albo dodać atrybut data ręcznie w wyjsciu petli, albo użyć metody bezposredniego znacznika script z kroku 2 dla najprostszej konfiguracji.

Metoda alternatywna 3: Użycie hooka (ready.php)

W przypadku bardziej zaawansowanego podejścia możesz użyć systemu hookow ProcessWire, aby automatycznie wstrzyknąć skrypt chatbota na każda stronę. Dodaj następujący kod do pliku site/ready.php:

<?php
$wire->addHookAfter('Page::render', function(HookEvent $event) {
    $html = $event->return;
    $script = '<script async src="https://asyntai.com/static/js/chat-widget.js" data-asyntai-id="YOUR_WIDGET_ID"></script>';
    $html = str_replace('</body>', $script . '</body>', $html);
    $event->return = $html;
});
?>

Ten hook przechwytuje wyrenderowany kod HTML każdej strony i automatycznie wstrzykuje skrypt Asyntai tuz przed zamykającym znacznikiem </body>.

Wskazówka: Podejście z hookiem w ready.php jest idealne, jeśli chcesz mieć chatbota na każdej stronie bez modyfikowania plików szablonów. Przetrwa również zmiany szablonów i aktualizacje motywów, ponieważ znajduje sie poza plikami szablonów.

Krok 3: Weryfikacja instalacji

Po zapisaniu zmian odwiedź swoja stronę ProcessWire w nowej karcie przeglądarki lub w oknie incognito. Powinieneś zobaczyć przycisk widgetu czatu w prawym dolnym rogu. Kliknij go, aby upewnić sie, ze otwiera sie i działa poprawnie.

Nie widzisz widgetu? Upewnij sie, ze zapisales wszystkie zmodyfikowane pliki. Spróbuj wyczyść pamięć podręczna przeglądarki lub wyświetlić stronę w oknie incognito. Jeśli pamięć podręczna szablonów ProcessWire jest wlaczona, może byc konieczne jej wyczyszczenie, przechodzac do Modules → Core → Template Engine Cache lub dodajac ?nocache=1 do adresu URL. Zweryfikuj również, czy plik szablonu jest faktycznie używany przez przeglodane strony.