Want to build your own 24/7 FAQ knowledge base?
LibraryH3lp subscriptions include unlimited independent internal or public-facing knowledge bases.

Search the LibraryH3lp Knowledge Base


Does chat work in Canvas?

1111 views   |   Last updated on Mar 19, 2020    integrations


Yes, there are two different approaches to integrating with Canvas

1) Place a chat snippet in the Canvas sidebar (requires Canvas admin permissions)

The following instructions were generously provided by a LibraryH3lp customer, who modified the custom JavaScript file connected to their theme:

  1. Identify where you'd like chat to appear on your Canvas pages.  We chose to have chat appear at the end of our right side bar, which can be identified using the CSS ID selector #right-side-wrapper.  When creating an appropriate CSS selector for your pages, keep in mind that Canvas could change the structure of the page, IDs, or class names at any time.
  2. Create a custom JavaScript file called global.js that inserts chat into your Canvas pages.  One way to insert chat is to use the jQuery .append() function; this approach is based off of this Canvas discussion.  See below for an example.
    • Important!! The "0000" at the end of the x.src line in the example below needs to be swapped out for your chat snippet ID number. 
    • This example assumes your subscription is on the main LibraryH3lp server (libraryh3lp.com).  Regional users will need to provide the correct domain in the chat snippet, such as "ca.libraryh3lp.com" for the Canada region.
  3. From Admin > Themes, open the theme editor and upload the custom global.js JavaScript file.


Example global.js File:

  $('#right-side-wrapper').append("<div class='needs-js'>chat loading...</div>");
(function() {
    var x = document.createElement("script"); x.type = "text/javascript"; x.async = true;
    x.src = (document.location.protocol === "https:" ? "https://" : "http://") + "libraryh3lp.com/js/libraryh3lp.js?0000";
    var y = document.getElementsByTagName("script")[0]; y.parentNode.insertBefore(x, y);

2) Place a simple iframe or chat button in any Canvas page (no Canvas admin permissions required)

It is easy to embed simple IFRAME chat widgets inside specific Canvas pages using their regular HTML editor.  And, you can also put in a "chat now" image of your choosing and have that open up a full-screen chat widget in its own separate window.  These are simple, and often, adequate implementations.

Here is an example page showing both approaches.
The bad news is that by default, Canvas seems to strip out JavaScript provided by non-admin users working with Canvas pages.  JavaScript is used in our standard code that provides a custom offline view instead of the chat widget, when the chat service is offline. 
So this means that with the currently-available (non-JavaScript) methods, the patron in Canvas will see an offline status LibraryH3lp widget when the chat service is offline, rather than something more customized.  This is not the end of the world, because the widget will say it is offline, and if the patron tries to chat anyway, they'll get back "message not received."
You could customize the title for the chat box within Canvas to say something like, "Are we offline?  Go here to send us email..." and have that link off to your email reference form. 


More Help

Search By Topic

Share this FAQ