Како додати Asyntai АИ четбот у CrafterCMS

Водич корак по корак за CrafterCMS веб-сајтове

Платформа:

Корак 1: Набавите свој код за уграђивање

Прво, идите на своју Asyntai контролну таблу и померите се до одељка „Код за уграђивање". Копирајте свој јединствени код за уграђивање који ће изгледати овако:

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

Напомена: Код изнад је само пример. Морате копирати свој јединствени код за уграђивање са своје Контролне табле јер садржи ваш лични ИД виџета.

Корак 2: Додајте у FreeMarker шаблон (препоручено)

CrafterCMS користи FreeMarker (.ftl) шаблоне за рендеровање страница. Најлакши начин за додавање четбота на све странице је уређивањем главног шаблона странице:

У Crafter Studio, идите на Контролна табла сајта > Типови садржаја или навигирајте до шаблона
Отворите свој главни шаблон странице (нпр. /templates/web/pages/home.ftl или основни распоред)
Пронађите затварајућу </body> ознаку
Налепите свој Asyntai код за уграђивање непосредно пре </body> ознаке:
 <script async src="https://asyntai.com/static/js/chat-widget.js" data-asyntai-id="YOUR_WIDGET_ID"></script> </body>
Сачувајте фајл и објавите кроз Crafter Studio

Савет: Додавање скрипте пре затварајуће </body> ознаке осигурава да се учитава након садржаја странице, што је препоручено за виџете за ћаскање и неће успорити учитавање странице.

Алтернативни метод 1: Коришћење Crafter компоненти шаблона

За бољу организацију, креирајте наменски шаблон компоненте за виџет четбота:

У Crafter Studio, креирајте нови фајл шаблона на /templates/web/components/asyntai-widget.ftl
Додајте следећи садржај у шаблон компоненте:
 <script async src="https://asyntai.com/static/js/chat-widget.js" data-asyntai-id="YOUR_WIDGET_ID"></script>
Укључите га у свој главни шаблон распореда користећи FreeMarker директиву за укључивање:
<#include "/templates/web/components/asyntai-widget.ftl" />
Алтернативно, ако користите Crafter-ов систем за рендеровање компоненти, користите:
<@renderComponent component=contentModel.asyntaiWidget />
Сачувајте оба фајла и објавите кроз Crafter Studio

Напомена: Коришћење засебног шаблона компоненте олакшава омогућавање или онемогућавање четбота на целом сајту коментарисањем једне линије за укључивање.

Алтернативни метод 2: Коришћење Crafter конфигурације заглавља/скрипти

CrafterCMS вам омогућава да глобално убацујете скрипте кроз конфигурацију сајта:

У Crafter Studio, навигирајте до Конфигурација сајта > Конфигурација
Отворите фајл Конфигурација Engine сајта (site-config.xml)
Додајте прилагођену конфигурацију убацивања скрипте:
<site>   <scripts> <script> <src>https://asyntai.com/static/js/chat-widget.js</src> <async>true</async> <data-asyntai-id>YOUR_WIDGET_ID</data-asyntai-id> </script> </scripts> </site>
Алтернативно, уредите свој основни FreeMarker распоред да чита из конфигурације сајта и динамички убацује скрипте:
<#if siteConfig.getString("scripts.script.src", "")?has_content> <script async src="${siteConfig.getString("scripts.script.src")}" data-asyntai-id="${siteConfig.getString("scripts.script.data-asyntai-id")}"></script> </#if>
Сачувајте и објавите измене конфигурације

Савет: Коришћење конфигурације сајта вам омогућава да управљате виџетом четбота без директног мењања фајлова шаблона, чинећи га лакшим за ажурирање или уклањање касније.

Алтернативни метод 3: Коришћење Groovy контролера

CrafterCMS подржава Groovy скрипте за серверску логику. Можете користити контролер за динамичко додавање скрипте четбота:

Креирајте Groovy скрипту у /scripts/pages/ (нпр. /scripts/pages/home.groovy или ваш контролер за цео сајт)
Додајте следећи код за убацивање URL-а скрипте у модел шаблона:
// /scripts/pages/home.groovy import org.craftercms.engine.service.context.SiteContext def siteContext = SiteContext.current // Add Asyntai chatbot configuration to the model model.asyntaiEnabled = true model.asyntaiWidgetId = "YOUR_WIDGET_ID" model.asyntaiScriptSrc = "https://asyntai.com/static/js/chat-widget.js"
Затим референцирајте променљиве модела у свом FreeMarker шаблону:
<#if model.asyntaiEnabled?? && model.asyntaiEnabled> <script async src="${model.asyntaiScriptSrc}" data-asyntai-id="${model.asyntaiWidgetId}"></script> </#if>
Сачувајте и Groovy скрипту и фајл шаблона
Објавите промене кроз Crafter Studio

Напомена: Приступ са Groovy контролером је користан када вам је потребна условна логика (нпр. омогућавање четбота само за одређене улоге корисника или типове страница) или када желите да повучете конфигурационе вредности из спољних извора.

Корак 3: Објавите и верификујте

Након извршавања промена, објавите их кроз Crafter Studio:

У Crafter Studio, идите на Контролну таблу сајта
Прегледајте своје промене у одељку Моја недавна активност или Чека одобрење
Кликните Објави да деплојујете промене на свој сајт уживо
Отворите свој веб-сајт у новој картици претраживача или инкогнито прозору
Требало би да видите дугме виџета за ћаскање у доњем десном углу
Кликните на њега да бисте се уверили да се отвара и исправно ради

Не видите виџет? Уверите се да сте објавили промене кроз Crafter Studio. Верификујте да уређујете тачан фајл шаблона који ваше странице користе. Обришите кеш претраживача или прегледајте у инкогнито прозору. Ако користите Crafter кеширање, обришите Engine кеш са Crafter Studio контролне табле.

Локација шаблона: Локације шаблона CrafterCMS-а могу варирати у зависности од структуре вашег пројекта. Уобичајене локације укључују /templates/web/pages/ за шаблоне страница, /templates/web/components/ за шаблоне компоненти и /templates/web/ за шаблоне распореда. Проверите постојеће шаблоне да пронађете где је </body> ознака дефинисана.