Widget Integration
Add your Chatbot to your website with the Solvemate Chat Widget.
It takes only a few lines of JavaScript code and all content and design settings are done in the Solvemate Web App - no coding skills needed!
Integrations Overview
There are several types of integrations available:
| Type | Description | Integration effort |
|---|---|---|
| Beacon | Shows the chat beacon on the bottom right corner of the website. | Low |
| Modal | Shows the Chat Widget in an overlay, centred on the website. | Low |
| Inline | Show the Chat Widget directly within your website content. | Low |
| In-App | Shows the Chat Widget in any mobile app. | Custom |
| Pop-up | Will add the beacon to your website without loading any files from our CDN. | Medium |
Google Tag Manager
It is not recommended to add the integrations via Google Tag Manager as it can be blocked by ad blocker browser extensions.
Beacon Page
Beacon page can be used publicly and linked to from everywhere.
The project specific URL is: https://expert.solvemate.com/v2/{your_chatbot_id}
Example: https://expert.solvemate.com/v2/5d7b4b91cff722ae396cfb41
Modal Page
Modal page can be used publicly and linked to from everywhere. This is the page that has to be loaded within apps on platforms like Android or iOS to render widget in a webview.
The project specific URL is: https://expert.solvemate.com/modal/{your_chatbot_id}
Example: https://expert.solvemate.com/modal/5d7b4b91cff722ae396cfb41
Content Security Policy
If your website uses a Content Security Policy (CSP) as an extra security layer, you need to add Solvemate endpoints to the relevant directives.
| Directive | Source |
|---|---|
| script-src | https://widget.solvemate.com |
| connect-src | https://api.solvemate.com |
| img-src | https://images.solvemate.com |
| style-src | https://widget.solvemate.com |
| frame-src | https://widget.solvemate.com |