Как да добавите 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: Вземете вашия код за вграждане

First, go to your Asyntai Dashboard and scroll down to the "Embed Code" section. Copy your unique embed code which will look like this:

Стъпка 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 с вашия действителен ID на уиджета от таблото за управление
7. Натиснете "Save"
8. Изчистете кеша на TYPO3: Admin Tools → Maintenance → Flush TYPO3 and PHP Cache

Алтернатива: Използване на Site Package (За Site Packages)

Ако използвате 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 с вашия действителен 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: Проверка на инсталацията

След като запазите промените и изчистите кеша, посетете уебсайта си в нов раздел на браузъра или в инкогнито прозорец. Трябва да видите бутона на чат уиджета в долния десен ъгъл. Кликнете върху него, за да се уверите, че се отваря и работи правилно.