Other Platforms

General guide for adding the OpenSpeechAI chat widget to any website platform not specifically covered in our docs.

What You'll Need

Before starting the installation, make sure you have:

A website platform that allows custom code or scripts
OpenSpeechAI account with a configured agent
Admin access to your website's settings

Before you can install the widget, you need to get your unique widget script from the OpenSpeechAI dashboard.

To get your widget script:

Log in to your OpenSpeechAI dashboard
Navigate to Agents and select your agent
Click the Widget tab at the top
You'll see your unique installation code
Click Copy to copy it to your clipboard

The code looks like this:

<script
  src="https://widget.openspeechai.com/widgets/chat-widget.js?widgetId=abc-123"
  defer
  crossorigin="anonymous"
></script>

General Installation Steps

Every website platform is different, but the general approach is the same:

Find your platform's Custom Code or Code Injection settings
Look for a section to add code to the Footer or Body end
Paste your widget script there
Save your changes

Important: Always add the script before the closing </body> tag, not in the <head> section. This ensures your page loads quickly and the widget works correctly.

Common Platforms

Here's where to find custom code settings on popular platforms:

Framer

Framer allows you to add custom code that runs on your entire website or on a specific page.

Click Project Settings in the top right corner
Go to the General tab
Scroll down to the Custom Code section
Paste your widget script in the End of <body> tag field
Click Save

Framer Custom Code settings

Important: Custom code does not load in Framer's preview mode. You must publish your website first, then open it in the browser to see the widget.

To add the widget to a single page only, go to that page's settings and paste the script in the page-specific custom code section instead.

Carrd

Requires Pro Standard plan or higher.

Click Add Element
Click Embed to create a new Embed element
Set Type to Code
Paste your widget script in the Code field
Set Style to Hidden, then select Body End
Publish your site

Note: The embed element will not output anything in the builder. You must publish the site to see the widget.

Ghost

Go to Settings → Advanced → Code Injection
Paste your widget script in the Site Footer field
Click Save

The Site Footer code is placed before the closing </body> tag and will appear on every page of your site.

HTML/Static Sites

Add the script directly before </body> in your HTML file

Test Your Installation

After adding the script:

Open your site in a new browser tab
You should see the chat widget in the bottom-right corner
Click on the widget to open the chat interface
Send a test message to verify your agent responds

If the widget doesn't appear, try clearing your browser cache:

Windows/Linux: Press Ctrl + Shift + R
Mac: Press Cmd + Shift + R

Troubleshooting

Widget not appearing?

Clear your browser cache and refresh
Verify the script is placed before </body>, not in <head>
Check that you copied the complete script from your dashboard
Confirm your platform supports custom JavaScript

Platform doesn't allow custom code?

Some platforms restrict custom scripts on free plans
Check if upgrading your plan unlocks custom code features
Contact your platform's support for guidance

Need help?

If you're still experiencing issues, email us at shri@openspeechai.com with:

Your website URL
Which platform you're using
Screenshot of the issue

We're here to help you get up and running!