The Channel Developers

Welcome to the Channel Developers. You'll find comprehensive guides and documentation to help you start working with Channel-docs as quickly as possible, as well as support if you get stuck. Let's jump right in!

Get Started    

Customization

Customizing launcher

You can fully customize launcher button instead of using default launcher provided by ChannelIO. Create your own button and set its css selector value to customLauncherSelector property. You can set multiple selectors separated by a comma (ex. ".custom-button1, .custom-button2"). For more information about css selectors, check this. You also need to set hideChannelButtonOnBoot property to true.

<!-- Channel Plugin Scripts -->
<script>
  (function() {
    var w = window;
    if (w.ChannelIO) {
      return (window.console.error || window.console.log || function(){})('ChannelIO script included twice.');
    }
    var ch = function() {
      ch.c(arguments);
    };
    ch.q = [];
    ch.c = function(args) {
      ch.q.push(args);
    };
    w.ChannelIO = ch;
    function l() {
      if (w.ChannelIOInitialized) {
        return;
      }
      w.ChannelIOInitialized = true;
      var s = document.createElement('script');
      s.type = 'text/javascript';
      s.async = true;
      s.src = 'https://cdn.channel.io/plugin/ch-plugin-web.js';
      s.charset = 'UTF-8';
      var x = document.getElementsByTagName('script')[0];
      x.parentNode.insertBefore(s, x);
    }
    if (document.readyState === 'complete') {
      l();
    } else if (window.attachEvent) {
      window.attachEvent('onload', l);
    } else {
      window.addEventListener('DOMContentLoaded', l, false);
      window.addEventListener('load', l, false);
    }
  })();
  ChannelIO('boot', {
    "pluginKey": "YOUR_PLUGIN_KEY",
    "customLauncherSelector": ".custom-button-1, #custom-button-2",
    "hideChannelButtonOnBoot": true
  });
<!-- End Channel Plugin -->
 
<button class="custom-button-1">Open</button>
<a id="custom-button-2">Open</a>

Updated 9 months ago

Customization


Suggested Edits are limited on API Reference Pages

You can only suggest edits to Markdown body content, but not to the API spec.