Opening Xeno from an item / button

Opening Xeno from an item / button

Written by Grace Williamson
Last update: Monday, Dec 09, 2019

To add a button or a menu navigation item on your site that will open the Xeno chatbox, you have 3 choices:


A. The URL

To automatically open the Xeno chatbox when someone lands on a page, please add “#chat-open” to the end of your URL.

Here is an example:

https://your-website.com/products#chat-open

To automatically open the Xeno chatbox Meetings Card, when someone lands on a page, please add “#chat-open-meetings” to the end of your URL.

https://your-website.com/products#chat-open-meetings

Just add any of the following terms to an URL where Xeno is deployed to point to a specific Xeno Card:

  • #chat-open-about
  • #chat-open-changelog
  • #chat-open-conversation
  • #chat-open-conversations
  • #chat-open-faq
  • #chat-open-homepage
  • #chat-open-meetings

Or simply in a DOM element:

<a href="https://your-website.com/products#chat-open">My Website</a>


The above solution only work when used on an unopened page. For example, you can use this solution when you send a link to a specific page, in the chat or in an e-mail.

B. A DOM element class

To open the Xeno chatbox from a DOM element, you just have to add the xeno-open-widget class to the element.

Here is an example:

<button type="button" class="xeno-open-widget">Click Me!</button>
<span class="xeno-open-widget">Click Me!</span>

You can also use this syntax to open a specific Card:

<button type="button" class="xeno-open-widget" data-view="meetings">Click Me!</button>
<span class="xeno-open-widget" data-view="meetings">Click Me!</span>


C. Using Xeno API functions

You can also use the Xeno API functions show() and hide() that allows you to open/close the chat.

Here is an example:

document.getElementById('my-button').addEventListener("click", function(event) {
  _xeno.show();
});


The B and C solutions will work on an already-loaded page. For example, you can use these solutions to open the Xeno chatbox from a button.

Javascript API

11 articles in this category.
Written by Grace Williamson.