Cómo añadir el chatbot de IA de Asyntai a TYPO3

Plataforma:

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

Paso 1: Obtén su código de inserción

Primero, ve a su Panel de control de Asyntai y desplácese hasta la sección "Código de inserción". Copie su código de inserción único que se verá así:

Paso 2: Usar TypoScript footerData (Recomendado)

La forma mas fácil de agregar el chatbot a todas las páginas es usando footerData de TypoScript:

1. Inicia sesión en su backend de TYPO3
2. Ve a Web → Template
3. Seleccione su página raíz en el árbol de páginas
4. Haga clic en "Edit the whole template record" (o seleccione "Info/Modify" y luego "Setup")
5. In the Setup field, add the following TypoScript code:
   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. Reemplaza YOUR_WIDGET_ID con su ID de widget real del panel de control
7. Haga clic en "Save"
8. Vacia la cache de TYPO3: Admin Tools → Maintenance → Flush TYPO3 and PHP Cache

Alternativa: Usar Site Package (Para Site Packages)

Si estás utilizando un paquete de sitio, puede agregar el script a través de su archivo de configuración TypoScript:

1. Navegue a la carpeta de su paquete de sitio: packages/your_sitepackage/Configuration/TypoScript/
2. Abra o cree setup.typoscript
3. Añada el siguiente código:
   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. Reemplaza YOUR_WIDGET_ID con su ID de widget real
5. Limpie la caché en el backend de TYPO3

Alternativa: Usar plantilla Fluid (FooterAssets)

For sites using Fluid templates, you can use the FooterAssets section:

1. Navegue a su archivo de plantilla Fluid (generalmente en Resources/Private/Templates/)
2. Añada una sección FooterAssets en su layout o plantilla:
   <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. Make sure your page layout renders the FooterAssets section:
   <f:render section="FooterAssets" optional="true" />
4. Limpie la caché de TYPO3

Alternativa: Usar AssetCollector (Para desarrolladores)

For extension developers, TYPO3 v10.3+ offers the AssetCollector API:

1. En su código PHP (por ejemplo, un controlador o middleware), inyecta el AssetCollector
2. Añada el script con atributos personalizados:
   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']
);

Paso 3: Verificar la instalación

Después de guardar sus cambios y limpiar la caché, visite su sitio web en una nueva pestaña del navegador o en una ventana de incógnito. Deberías ver el botón del widget de chat en la esquina inferior derecha. Haga clic en él para asegurarte de que se abra y funciona correctamente.