How to Add Asyntai AI Chatbot to MODX

Step-by-step guide for MODX CMS websites

Platform:

Step 1: Get Your Embed Code

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

<script async src="https://asyntai.com/static/js/chat-widget.js" data-asyntai-id="YOUR_WIDGET_ID"></script>

Note: The code above is just an example. You must copy your own unique embed code from your Dashboard as it contains your personal widget ID.

Step 2: Add to MODX Template (Recommended)

The recommended way to add the chatbot is by editing your MODX Template directly in the MODX Manager:

Log in to your MODX Manager (admin panel)
In the left sidebar, go to Elements > Templates
Open your site's template (usually called "BaseTemplate" or your active template)
Find the closing </body> tag in the template code
Paste your Asyntai embed code just before the closing </body> tag
Click "Save" to save the template

<!-- Your existing template content -->

<script async src="https://asyntai.com/static/js/chat-widget.js" data-asyntai-id="YOUR_WIDGET_ID"></script>
</body>
</html>

Tip: Adding the code just before the closing </body> tag ensures the chatbot loads after all page content, which is the recommended placement for chat widgets and won't slow down your page loading.

Alternative Method 1: Using a MODX Chunk

You can use a MODX Chunk to keep the embed code separate and reusable:

In the MODX Manager, go to Elements > Chunks
Click "New Chunk" to create a new chunk
Name the chunk "asyntaiWidget"
Paste your Asyntai embed code into the chunk content area
Click "Save"
Open your template (under Elements > Templates)
Add the chunk call [[$asyntaiWidget]] just before the closing </body> tag
Save the template

<!-- In your Template, before </body> -->
[[$asyntaiWidget]]
</body>
</html>

Tip: Using a Chunk makes it easy to manage and update the embed code in one place, especially if you use multiple templates across your site.

Alternative Method 2: Using MODX System Settings (HTML Head/Footer)

Some MODX setups include placeholders for footer scripts via System Settings:

In the MODX Manager, go to System > System Settings
Filter by "htmlhead" or search for a custom system setting for footer scripts
If your setup has a placeholder for footer scripts (such as [[++footer_scripts]]), you can use it
Set the system setting value to your Asyntai embed code
Make sure the corresponding placeholder [[++footer_scripts]] is present in your template before the closing </body> tag
Save the system setting

<!-- In your Template, before </body> -->
[[++footer_scripts]]
</body>
</html>

Note: This method depends on your MODX setup having a custom system setting for footer scripts. If one does not exist, you can create a custom system setting and reference it in your template using the [[++setting_key]] syntax.

Alternative Method 3: Using a MODX Plugin (OnWebPagePrerender)

For an advanced approach, you can create a MODX Plugin that automatically injects the chatbot code into every page:

In the MODX Manager, go to Elements > Plugins
Click "New Plugin" to create a new plugin
Name the plugin "AsyntaiChatbot"
Paste the following PHP code into the plugin code area:

$output = &$modx->resource->_output;
$script = '<script async src="https://asyntai.com/static/js/chat-widget.js" data-asyntai-id="YOUR_WIDGET_ID"></script>';
$output = str_replace('</body>', $script . '</body>', $output);

Click the "System Events" tab
Check the box next to "OnWebPagePrerender" to fire this plugin on that event
Click "Save"

Important: Replace YOUR_WIDGET_ID with your actual widget ID from the Asyntai Dashboard. This plugin will automatically inject the chatbot script into every page on your MODX site before it is rendered.

Step 3: Clear Cache and Verify

After adding the embed code using any of the methods above, you need to clear the MODX cache and verify the installation:

In the MODX Manager, go to Manage > Clear Cache (or click the clear cache icon in the top menu)
Open your website in a new browser tab or incognito window
You should see the chat widget button in the bottom right corner of your page
Click on it to make sure it opens and works correctly

Not seeing the widget? Make sure you have cleared the MODX cache from Manage > Clear Cache in the MODX Manager. Also try clearing your browser cache or viewing the site in an incognito window. If you used the Plugin method, verify that the "OnWebPagePrerender" system event is checked for your plugin.