Integration Steps

TYPO3 is a powerful enterprise content management system. Here's how to add your Cloudpresser AI chatbot:

Method 1: Using TypoScript

The most common way to add custom code to TYPO3 is through TypoScript:

Get your chatbot code:
- Go to your Cloudpresser AI Chat dashboard
- Select the chatbot you want to integrate
- Click on the "View Code" or "Integration" button
- Copy the provided code snippet
Add your chatbot code using TypoScript:
- Log in to your TYPO3 backend
- Go to Template module
- Select your root template
- Click on "Edit the whole template record"
- Go to the "Setup" field
- Add the following TypoScript code:
```
page.includeJS {
    cloudpresserChat = https://cloudpresserai.com/chatbot-widget.js
    cloudpresserChat.external = 1
    cloudpresserChat.data.data-chatbot-id = YOUR_CHATBOT_ID
}
```
Replace YOUR_CHATBOT_ID with your actual chatbot ID from the Cloudpresser dashboard.
- Save and close the template
- Clear the TYPO3 cache

Alternative Method: Using a Site Package

If you're using a custom site package, you can add the code directly to your template:

Locate your site package's header template:
- Navigate to your site package extension
- Find the header partial template (often in Resources/Private/Partials/Page/Header.html)
- Add your chatbot code just before the closing </head> tag
- Save the file
- Clear the TYPO3 cache

Note: Always clear the TYPO3 cache after making changes to templates or TypoScript. Go to the TYPO3 backend and use the flush cache option in the dropdown menu.

Method 3: Using headerData

If you prefer to use the headerData approach instead of includeJS, you can use this alternative method:

page.headerData.1000 = TEXT
page.headerData.1000.value (
    <script src="https://cloudpresserai.com/chatbot-widget.js" data-chatbot-id="YOUR_CHATBOT_ID" async></script>
)

TYPO3 Version Differences

TYPO3 9.x and 10.x

The integration methods described above work for TYPO3 9.x and 10.x.

TYPO3 11.x and 12.x

For newer versions, you can also use the Site Configuration to add custom headers. Go to Site Management → Sites and edit your site configuration.

Troubleshooting

Chatbot not appearing on the site

Ensure the code was added correctly and that you've cleared the TYPO3 cache. Try refreshing your browser cache or viewing in an incognito window.

TypoScript not being applied

Make sure you're editing the correct template and that your TypoScript is included in the template hierarchy.

Need Help?

If you're experiencing issues with the TYPO3 integration, please contact our support team at [email protected].

TYPO3 Integration Guide