How to Add Asyntai AI Chatbot to OpenCart

Step-by-step guide for OpenCart websites

Platform:

The Easy Way: Install the Asyntai Extension

We publish a free extension on the OpenCart Marketplace. It puts the chatbot on your storefront and connects your account, and there is no code to copy and no template to edit. It works on OpenCart 3.x and 4.x.

Download Asyntai - AI Chatbot from the OpenCart Marketplace
In your admin panel, go to Extensions → Installer and upload the ZIP file
Go to Extensions → Extensions, choose Modules in the list, find Asyntai AI Chatbot and press the green install button
Press edit, then press Connect to Asyntai. A window opens where you sign in or create an account.

That is all. The chatbot is live on your storefront when the window closes.

Your products, prices and stock

When you connect, the extension also lets Asyntai read your catalogue. Your assistant then answers with the price you charge today and tells shoppers what is in stock, instead of repeating whatever your pages said when they were last read.

Asyntai reads your products through a read-only address on your own store. Every request is signed, and the reply carries the prices a shopper would actually pay, with your tax rules already applied. You can switch this off at any time on the extension's settings screen.

Updating from version 1.0.0? OpenCart clears a module's settings when you uninstall it, so press Connect to Asyntai once after the update. From this version on, updates keep your connection.

Or Add the Code Yourself

Prefer not to install an extension? The rest of this page shows how to add the chatbot by hand. You will not get the catalogue reading this way.

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>(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>

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: Edit Footer Template

The most straightforward way to add the chatbot is by editing your theme's footer template:

Access your OpenCart files via FTP or file manager
Navigate to your theme's footer template:
- OpenCart 3.x/4.x: catalog/view/theme/YOUR_THEME/template/common/footer.twig
- OpenCart 2.x: catalog/view/theme/YOUR_THEME/template/common/footer.tpl
Open the footer file for editing
Find the closing </body> tag
Paste your Asyntai embed code just before the </body> tag
Save the file
Clear OpenCart cache: Dashboard → Blue gear icon (top right) → Refresh or delete contents of system/storage/cache/

Tip: If you're using the default theme, the path would be catalog/view/theme/default/template/common/footer.twig. Always create a backup before editing template files.

Alternative: Using Theme's Custom Code Option

Many modern OpenCart themes include a built-in option for custom code:

Log in to your OpenCart Admin Panel
Go to Extensions → Themes (or Extensions → Extensions → Themes)
Click Edit on your active theme
Look for a "Custom Code", "Footer Scripts", or "Custom JavaScript" section
Paste your Asyntai embed code
Click "Save"
Clear the cache

Note: Not all themes have this option. If your theme doesn't include custom code fields, use the template editing method or install an extension.

Alternative: Using a Custom Code Extension

You can install a free extension from the OpenCart Marketplace to add custom scripts:

Go to the OpenCart Marketplace
Search for "Custom Script", "Header Footer Scripts", or "Custom Code"
Download and install a suitable extension
In your admin panel, go to Extensions → Extensions → Modules
Find and install the custom code module
Configure the module and paste your Asyntai embed code in the footer section
Save and clear the cache

Important: Using extensions is recommended over editing core files, as they survive OpenCart updates. Popular extensions include "Custom Script in Header & Footer" available on the marketplace.

Alternative: Using addScript Method (For Developers)

For developers, OpenCart 3.x/4.x provides a programmatic way to add scripts:

Open catalog/controller/common/footer.php
Add the following line before $data['scripts'] = $this->document->getScripts('footer');:
$this->document->addScript('https://asyntai.com/static/js/chat-widget.js', 'footer');
For the data attribute, you'll need to modify the footer.twig to include it manually, or add inline JavaScript after the scripts loop

Note: For the widget to work properly with the data attribute, the template method is simpler as the addScript method doesn't support custom attributes directly.

Step 3: Verify Installation

After saving your changes and clearing the cache, visit your store in a new browser tab or incognito window. You should see the chat widget button in the bottom right corner. Click it to make sure it opens and works correctly.

Not seeing the widget? Make sure to clear OpenCart's cache. Go to your admin panel, click the blue gear icon in the top right corner, and click the refresh buttons. Also try clearing your browser cache or viewing in an incognito window. If you modified the wrong template file, check that your theme is using the file you edited.

Documentation