Hur du lägger till Asyntai AI-chattbot i Craft CMS
Steg-för-steg-guide för Craft CMS-webbplatser
Steg 1: Hämta din inbäddningskod
Gå först till din Asyntai-instrumentpanel och scrolla ner till avsnittet "Inbäddningskod". Kopiera din unika inbäddningskod som ser ut så här:
<script async src="https://asyntai.com/static/js/chat-widget.js" data-asyntai-id="YOUR_WIDGET_ID"></script>
Obs! Koden ovan är bara ett exempel. Du måste kopiera din egen unika inbäddningskod från din instrumentpanel eftersom den innehåller ditt personliga widget-ID.
Steg 2: Redigera din layoutmall (rekommenderas)
Det enklaste sättet att lägga till chattboten på alla sidor är att redigera din huvudlayoutmall:
- Access your Craft CMS project files via FTP, SSH, or your code editor
- Navigera till katalogen
templates/ - Hitta din huvudlayoutfil (vanligtvis namngiven
_layout.twig,_layout.htmleller placerad itemplates/_layouts/) - Hitta den avslutande taggen
</body> - Klistra in din Asyntai-inbäddningskod precis före taggen
</body> - Spara filen
Tips: Att lägga till skriptet före det avslutande </body>-taggen säkerställer att det laddas efter sidinnehållet, vilket rekommenderas för chattwidgetar och inte bromsar sidladdningen.
Alternative: Using Twig {% js %} Tag (Craft CMS 3.x+)
Craft CMS har en inbyggd Twig-tagg för att registrera JavaScript:
- Öppna din huvudlayoutmall
- Lägg till följande kod före det avslutande
</body>-taggen:{% 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 %} - Ersätt
YOUR_WIDGET_IDmed ditt faktiska widget-ID - Spara filen
Obs! The {% js %} tag automatically handles script registration and prevents duplicate loading if the same code appears multiple times.
Alternativ: Skapa en separat include-fil
För bättre organisation, skapa en dedikerad include-fil:
- Skapa en ny fil:
templates/_includes/chatbot.twig(eller.html) - Lägg till din Asyntai-inbäddningskod i den här filen:
<script async src="https://asyntai.com/static/js/chat-widget.js" data-asyntai-id="YOUR_WIDGET_ID"></script> - I din huvudlayoutmall, inkludera den här filen innan
</body>:{% include '_includes/chatbot' %} - Spara båda filerna
Tips: Att använda en inkluderingsfil gör det enkelt att aktivera/inaktivera chatboten på hela din webbplats genom att kommentera bort en enda rad.
Alternativ: Villkorlig inläsning
För att ladda chattboten endast på specifika sidor eller sektioner:
- I din layout- eller sidmall, använd Twig-villkor:
{% if entry.showChatbot ?? true %} <script async src="https://asyntai.com/static/js/chat-widget.js" data-asyntai-id="YOUR_WIDGET_ID"></script> {% endif %} - Eller kontrollera specifika avsnitt:
{% 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 %}
Steg 3: Verifiera installationen
Efter att du har sparat dina ändringar, besök din Craft CMS-webbplats i en ny webbläsarflik eller ett inkognitofönster. Du bör se widgetknappen för chatten i det nedre högra hörnet. Klicka på den för att kontrollera att den öppnas och fungerar korrekt.
Ser du inte widgeten? Se till att du sparat mallfilen och att du redigerar rätt layoutmall som dina sidor använder. Rensa webbläsarens cache eller visa sidan i ett inkognitofönster. Om du använder mallcaching, rensa Craft CMS-cachen från kontrollpanelen under Utilities > Clear Caches.
Mallplats: Platsen för Craft CMS-mallar kan variera beroende på din projektinställning. Vanliga platser inkluderar templates/_layout.twig, templates/_layouts/main.twig eller templates/_base.twig. Kontrollera dina befintliga mallar för att hitta var </body>-taggen är definierad.
Weebly