Single Page App

If you have a single page app then you can get Intercom installed on your page in two simple steps. So let's waste no time and get you chatting to your customers.

Step 1: Include Intercom JS Library

First, include the intercom JS library file in your HTML head element.

Intercom JS Library

//Set your APP_ID
var APP_ID = "APP_ID";

(function(){var w=window;var ic=w.Intercom;if(typeof ic==="function"){ic('reattach_activator');ic('update',intercomSettings);}else{var d=document;var i=function(){i.c(arguments)};i.q=[];i.c=function(args){i.q.push(args)};w.Intercom=i;function l(){var s=d.createElement('script');s.type='text/javascript';s.async=true;
s.src='https://widget.intercom.io/widget/' + APP_ID;
var x=d.getElementsByTagName('script')[0];x.parentNode.insertBefore(s,x);}if(w.attachEvent){w.attachEvent('onload',l);}else{w.addEventListener('load',l,false);}}})()

❗️

Have you set your APP_ID?

One of the most common issues people have when setting up Intercom first is they forget to include their App ID in the above library code and copy and paste it into their site. The problem is you won't see any error message and Intercom will not show up when you boot the Messenger in the next step. You can set it using a var as noted in the above example or manually in the code itself. You might need to include the App ID in multiple places so using a var is generally a good idea.

Step 2: Launch the Messenger

Once you have the Intercom library installed then you simply need to tell the Messenger to startup. You can do this using the Respond code snippet which will enable the Messenger to launch whenever the page is refreshed, i.e. no special action needs to be triggered to launch it.

Logged Out User

window.Intercom('boot', {
   app_id: APP_ID,
  //Logged out user so may not have any user related info
});

📘

Adding information in the boot

The above example is the most basic way you can launch the Messenger. It does not include any information when it boots. You can include information here if you like but that will depend on what Intercom products you are using and what information you need from your users

If you have the launcher on page where a user need to sign in to get to then you can include more info in that boot code.

Logged In Example

window.Intercom('boot', {
  app_id: APP_ID,
  email: '[email protected]',
  user_id: 'abc123',
  created_at: 1234567890,
});

Interactive Install Example

Intercom Install Example

The above link is to a Codepen where you can test the install steps above. Codepen allows you to copy and paste code into an JS (or HTML and CSS) editor where you see the results immediately. You can use your own App ID if you have one or your can use our test example App ID, whatever you find easier. For more info on Codepen and how to use it please see this page