如何将 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 async src="https://asyntai.com/static/js/chat-widget.js" data-asyntai-id="YOUR_WIDGET_ID"></script>
6. 将 YOUR_WIDGET_ID 替换为仪表板中的实际小部件 ID
7. 点击"保存"
8. 清除 TYPO3 缓存：Admin Tools → Maintenance → Flush TYPO3 and PHP Cache

替代方案：使用站点包（针对站点包）

如果您使用站点包，可以通过 TypoScript 配置文件添加脚本：

1. 导航到站点包文件夹：packages/your_sitepackage/Configuration/TypoScript/
2. 打开或创建 setup.typoscript
3. 添加以下代码：
   page.footerData {
  99 = TEXT
  99.value = <script async src="https://asyntai.com/static/js/chat-widget.js" data-asyntai-id="YOUR_WIDGET_ID"></script>
}
4. 将 YOUR_WIDGET_ID 替换为您的实际小部件 ID
5. 在 TYPO3 后台清除缓存

替代方案：使用 Fluid 模板（FooterAssets）

对于使用 Fluid 模板的站点，您可以使用 FooterAssets 部分：

1. 导航到 Fluid 模板文件（通常在 Resources/Private/Templates/ 中）
2. 在布局或模板中添加 FooterAssets 部分：
   <f:section name="FooterAssets">
  <script async src="https://asyntai.com/static/js/chat-widget.js" data-asyntai-id="YOUR_WIDGET_ID"></script>
</f:section>
3. 确保页面布局渲染了 FooterAssets 部分：
   <f:render section="FooterAssets" optional="true" />
4. 清除 TYPO3 缓存

替代方案：使用 AssetCollector（面向开发者）

对于扩展开发者，TYPO3 v10.3+ 提供了 AssetCollector API：

1. 在 PHP 代码中（例如控制器或中间件），注入 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：验证安装

保存更改并清除缓存后，在新的浏览器标签页或无痕窗口中访问您的网站。您应该会在右下角看到聊天小部件按钮。点击它以确保能正常打开和使用。