Integrate our Chat Widget into your Website
There are two ways for integrating the chat widget
Via JavaScript Header Script
Via iFrame
Integration via JavaScript Header Script
To add a chat bubble to the bottom right of your website add this script tag to your HTML. Replace customerName with the appropriate abbreviation. The chat bubble will be injected in the lower right corner of the page. Options for adapting styling will be supported soon.
<script> window.embeddedAmberAIChatWidgetConfig = { domain: "https://customerName.ambersearch.de" } </script> <script src="https://customerName.ambersearch.de/chat-widget/js/chat.js"></script>Integration via iFrame
The iFrame integration offers higher flexibility for the end-to-end integration. Depending on your requirements, you can either build the chat bubble according to the styles and layout of your website or place the iframe statically in your website.
<iframe src="https://customerName.ambersearch.de/amberaiwidget" title="amberAI Chatbot" style="height: 100%; width: 100%" frameborder="0"></iframe>Integrate a specific agent via iFrame
Instead of the general chat widget, you can also embed a specific agent so the iFrame uses exactly that agent and its configured sources, rather than the general search.
To do this:
Go to your agent, click the three dots and copy the share link.
Append
/chatto the end of that link.Use this URL as the
srcof your iFrame, just like with the normal widget integration.
Language setting for iFrame integration
You can control the language of amberaiwidget by passing the URL parameter appLanguage to the src value of the iframe. It is optional and accepts the value de or en, respectively for German and English. If not passed the language is inherited from browser's default language.
Examples: