What is embedding the chatbot?
Embedding the chatbot is a very easy process. Our embed code uses only one sentence of code to paste onto your webpages.
Who has access to the embed code?
How do I embed the bot?
- On the Embedding page, select the Copy to clipboard button.
Note: To have the bot automatically load open when you visit a page, add "#bot" to the end of any URL where the bot is embedded. When you click the URL the bot will load open
Once your bot is live on your webpages, review the Post-Launch: Promote your Service article!
Note: As of May 2022, Ocelot has new embed code available for the chatbot button.
- If you have previously embedded the chatbot button, we recommend you re-embed this code on all webpages where the old button exists.
With the old embed code, the following will still work:
- The welcome message, live chat first, and IDK behavior are determined by the settings on the Look & Feel and Behavior Settings pages.
- URL matching is the primary way conversations are associated with specific offices/departments at your school for filtering transcripts and analytics.
- The launcher, welcome message, live chat first, and IDK behavior are determined by the settings on the Look & Feel and Behavior Settings pages.
- URL matching is the primary way conversations are associated with specific offices/departments within your school for filtering transcripts and analytics.
For more settings about the Look & Feel of the page, please review the Navigating the Admin: Look & Feel Page article.
If your website makes use of HTML5 or WAI-ARIA landmarks, the bot may trigger a warning in accessibility audits. Add "data-ocelot-target" to the appropriate HTML container element to prevent this issue. We recommend using your site’s footer as the container element.
- Before: "<footer>… footer content here …</footer>"
- After: "<footer data-ocelot-target>… footer content here …</footer>"
Note: Be aware of any existing items on your site (i.e. floating anchor buttons) that might conflict with the chatbot’s launcher once embedded.
For more information on Content Security Policy (CSP), please review the Content Security Policy (CSP)