Како додати Asyntai AI чатбот на TYPO3

Платформа:

TYPO3

HTML/Custom WordPress Shopify WooCommerce BigCommerce Ecwid Wix Squarespace Webflow Weebly HubSpot Tilda Adobe Experience Manager Duda Google Sites Bludit Plesk Concrete CMS Craft CMS Contentful Docusaurus Strapi Joomla Kentico Drupal Magento Blogger Bitrix TYPO3 PrestaShop OpenCart Ghost Hugo Statamic Umbraco Volusion Moodle SilverStripe Grav October CMS ProcessWire Sanity ExpressionEngine Sylius Backdrop CMS MODX Bagisto PayloadCMS e107 CrafterCMS Kirby MedusaCMS DatoCMS GoDaddy Framer Bubble Carrd Jimdo Strikingly Kajabi Teachable Thinkific ClickFunnels Hostinger Unbounce Leadpages Systeme.io Instapage

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

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

Корак 2: Коришћење TypoScript footerData (препоручено)

Најлакши начин за додавање чатбота на све странице је коришћење TypoScript footerData:

1. Пријавите се на ваш TYPO3 бекенд
2. Идите на Web → Template
3. Изаберите вашу основну страницу у стаблу страница
4. Кликните на "Edit the whole template record" (или изаберите "Info/Modify" и затим "Setup")
5. У пољу Setup, додајте следећи TypoScript код:
   page.footerData.99 = TEXT
page.footerData.99.value = <script>(function(){var l=function(){var s=document.createElement("script");s.src="https://widget.asyntai.com/static/js/chat-widget.js";s.async=true;s.setAttribute("data-asyntai-id","YOUR_WIDGET_ID");document.head.appendChild(s)};if(document.readyState==="complete"){l()}else{window.addEventListener("load",l)}})();</script>
6. Замените YOUR_WIDGET_ID стварним ИД-ом виџета са контролне табле
7. Кликните „Сачувај"
8. Очистите TYPO3 кеш: Admin Tools → Maintenance → Flush TYPO3 and PHP Cache

Алтернатива: Коришћење Site Package-а (за Site Package-ове)

Ако користите site package, можете додати скрипту путем вашег TypoScript конфигурационог фајла:

1. Навигирајте до фасцикле вашег site package-а: packages/your_sitepackage/Configuration/TypoScript/
2. Отворите или креирајте setup.typoscript
3. Додајте следећи код:
   page.footerData {
  99 = TEXT
  99.value = <script>(function(){var l=function(){var s=document.createElement("script");s.src="https://widget.asyntai.com/static/js/chat-widget.js";s.async=true;s.setAttribute("data-asyntai-id","YOUR_WIDGET_ID");document.head.appendChild(s)};if(document.readyState==="complete"){l()}else{window.addEventListener("load",l)}})();</script>
}
4. Замените YOUR_WIDGET_ID стварним ИД-ом виџета
5. Очистите кеш у TYPO3 бекенду

Алтернатива: Коришћење Fluid шаблона (FooterAssets)

За сајтове који користе Fluid шаблоне, можете користити FooterAssets секцију:

1. Навигирајте до вашег Fluid фајла шаблона (обично у Resources/Private/Templates/)
2. Додајте FooterAssets секцију у ваш распоред или шаблон:
   <f:section name="FooterAssets">
  <script>(function(){var l=function(){var s=document.createElement("script");s.src="https://widget.asyntai.com/static/js/chat-widget.js";s.async=true;s.setAttribute("data-asyntai-id","YOUR_WIDGET_ID");document.head.appendChild(s)};if(document.readyState==="complete"){l()}else{window.addEventListener("load",l)}})();</script>
</f:section>
3. Проверите да ли ваш распоред странице рендерује FooterAssets секцију:
   <f:render section="FooterAssets" optional="true" />
4. Очистите TYPO3 кеш

Алтернатива: Коришћење AssetCollector-а (за програмере)

За програмере проширења, TYPO3 v10.3+ нуди AssetCollector API:

1. У вашем PHP коду (нпр. контролер или middleware), убаците AssetCollector
2. Додајте скрипту са прилагођеним атрибутима:
   use TYPO3\CMS\Core\Page\AssetCollector;

$this->assetCollector->addJavaScript(
  'asyntai_chatbot',
  'https://asyntai.com/static/js/chat-widget.js',
  ['async' => 'async', 'data-asyntai-id' => 'YOUR_WIDGET_ID']
);

Корак 3: Верификујте инсталацију

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