Integrating the Web Chat Widget into MyWebsite Now

Valid for MyWebsite Now

This article explains how to retrieve the unique widget script for your AI Receptionist and embed it into your IONOS MyWebsite Now website. By adding this code to your website's HTML source code, you make the chat interface available to your visitors.

Requirements

Before you begin, please ensure you have the following:

You have purchased the IONOS AI Receptionist product and completed the initial setup. [Go to product website].

Retrieving the Widget Script

Before you can edit your website code, you must locate the unique script associated with your AI Receptionist. If you're new to the platform, you would have received your script soon after training your AI Receptionist. If you need to find your unique script again, follow these steps:

Log in to your IONOS account.
Click Menu > AI Receptionist in the title bar. The AI Agent Portal opens.
Click on Customer Portal under Actions for the desired receptionist. The Dashboard opens.
Click Settings in the main navigation bar.
Select the Chat tab.
Locate the Widget Script section.
Copy the entire script code to your clipboard.

Note

Your script will look similar to the example below, but will contain your unique client secret.

Adding the Code to Your MyWebsite

Once you have copied the script, you must insert it into your website's source code.

Log in to your IONOS account.
In the title bar click on Menu > Websites & Stores.
Click on Manage website in the tile with the name of your online project. The Presence Suite for this project opens.
In the left menu bar of the Presence Suite, select Website > Editor. The MyWebsite Now Editor opens in a new window.
Click Settings in the menu bar of the MyWebsite Now editor.
Open the Custom Head Code settings.
Paste the code you retrieved in step 1 into the input field.
If already available, select the appropriate consent option in the Privacy Consent section. Then click Save to apply the changes.
If no suitable privacy consent is available yet:
- Click New to create a new option. A pop-up window will appear.
- Enter the required information, such as name and description.
- Click Done. The pop-up window closes.
- Click Save.

Configuration for Different Website URLs

If you intend to integrate the web chat on a website that has a different address (URL) than the page used to train the AI initially, you must specify this URL in the settings to ensure the widget functions correctly.

While still in the Chat tab (Settings > Chat), locate the Client Website Base URL field.
Enter the URL of the website where the chat widget will be installed.
Save your changes.

Verify the Integration

To ensure the chat widget is working correctly:

Publish your website changes.
Open your live website in a browser and refresh the page.
Confirm that the chat icon appears in the bottom-right corner of the screen.