Jak dodać chatbota AI Asyntai do Craft CMS

Przewodnik krok po kroku dla stron Craft 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: Edytuj szablon układu (zalecane)

Najłatwiejszym sposobem dodania chatbota do wszystkich stron jest edycja głównego szablonu układu:

Access your Craft CMS project files via FTP, SSH, or your code editor
Przejdź do katalogu templates/
Znajdź główny plik układu (zwykle o nazwie _layout.twig, _layout.html lub znajdujący się w templates/_layouts/)
Znajdź zamykający znacznik </body>
Wklej kod osadzania Asyntai tuz przed znacznikiem </body>
Zapisz plik

Wskazówka: Dodanie skryptu przed zamykającym znacznikiem </body> zapewnia, że ładuje się on po treści strony, co jest zalecane dla widgetów czatu i nie spowalnia ładowania strony.

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

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

Otwórz główny szablon układu
Dodaj następujący kod przed zamykającym znacznikiem </body>:
{% 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 %}
Replace YOUR_WIDGET_ID with your actual widget ID
Zapisz plik

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

Alternatywa: Utwórz oddzielny plik dołączany

Dla lepszej organizacji utwórz dedykowany plik dołączany:

Utwórz nowy plik: templates/_includes/chatbot.twig (lub .html)
Dodaj kod osadzania Asyntai do tego pliku:
<script async src="https://asyntai.com/static/js/chat-widget.js" data-asyntai-id="YOUR_WIDGET_ID"></script>
W głównym szablonie układu dołącz ten plik przed </body>:
{% include '_includes/chatbot' %}
Zapisz oba pliki

Wskazówka: Użycie pliku dołączanego ułatwia włączanie/wyłączanie chatbota na całej witrynie poprzez zakomentowanie jednej linii.

Alternatywa: Warunkowe ładowanie

Aby ładować chatbota tylko na konkretnych stronach lub sekcjach:

W szablonie układu lub strony użyj warunków Twig:
{% if entry.showChatbot ?? true %} <script async src="https://asyntai.com/static/js/chat-widget.js" data-asyntai-id="YOUR_WIDGET_ID"></script> {% endif %}
Lub sprawdź konkretne sekcję:
{% 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 %}

Krok 3: Weryfikacja instalacji

Po zapisaniu zmian odwiedź swoja stronę Craft CMS w nowej karcie przeglądarki lub w oknie incognito. Powinieneś zobaczyć przycisk widgetu czatu w prawym dolnym rogu. Kliknij go, aby upewnić się, że otwiera się i działa prawidłowo.

Nie widzisz widgetu? Upewnij się, że zapisales plik szablonu i że edytujesz wlasciwy szablon układu, z którego korzystaja Twoje strony. Wyczyść pamięć podręczną przeglądarki lub wyświetl stronę w oknie incognito. Jeśli używasz buforowania szablonów, wyczyść pamięć podręczną Craft CMS z Panelu sterowania w sekcji Utilities > Clear Caches.

Lokalizacja szablonu: Lokalizacje szablonów Craft CMS mogą się roznic w zależności od konfiguracji projektu. Typowe lokalizacje to templates/_layout.twig, templates/_layouts/main.twig lub templates/_base.twig. Sprawdź istniejace szablony, aby znalezc miejsce, w którym zdefiniowany jest znacznik </body>.