Installation Quickstart

By the end of this section, you'll have Intercom on a local webpage like the below GIF.

Intercom installed on a local webpage

Intercom installed on a local webpage

Installing Intercom

To get started, head to this link and download the folder called 01_quick_start.

Open the file 001_getting_started.html in your favourite text editor (Here's a link to some that we like).

`0001.html` should look a bit like this

0001.html should look a bit like this

Replace the app_id value with your own app_id found here and save!

Right click anywhere on the code and click "Open in browser", or go to where you saved it, right click on the file and press "Open in browser"

You are now a Visitor unless you've interacted with the Messenger already.

Visitors are customers that come to your site without logging in, and don't send any conversations in the Messenger.

Sending a message to Intercom.

Sending a message to Intercom.

Once a Visitor sends a message into Intercom, they become a Lead.

Leads are any customer that sends a message to Intercom, but haven't logged into your application yet.

That Lead now has a profile in Intercom, with a randomly generated name (e.g. Orange Umbrella from Dublin), that you can interact with. The message they just sent will also now appear in Inbox!

You've successfully installed Intercom on your application for visitors and leads!

Creating leads and users

You've created a lead. The Messenger will automatically create their profile in Intercom for you.

Because we don't have any information about the lead, it will be created with a randomly generated name. All we know about this lead is that they are on your website and have interacted with the Messenger!

If the lead leaves their email with our Email Collector, you can email them, even if they go offline.

Enter in your email address here now, like this 👇

That will create a lead profile, with the email address that I entered in the collector.

Notice there are now 2 conversations, even though they are both from the same person. This is because the Messenger was opened in a different session.

Cookies & Leads

If a lead comes back to your site on a different browser, or machine, we won't know who they are unless the cookie is present that we install on that page.

The best way to get around this is to create a sign up flow, and create users.

Creating Users

For a quick walkthrough on creating users, go to this link and follow the same steps as before to save the code.

Once a user has been created, they will exist in your "All Users" list on your Platform, like this 👇

Where do I get the user information?

If you want to store users in your application, you will need to create their details yourself! The Messenger won't populate any of their data for you. After the lead leaves their email address in the collector, the Messenger won't collect any more data, the rest is up to you!

To create a user, you need to send Intercom an email or a user_id in the intercomSettings Javascript snippet. Check out the code below 👇

identifiers

We encourage sending both a user_id AND an email to make sure that you're identifying the right user.

This code will create a user with the name Robert Baratheon in your app. Go to your application by clicking on this link to check them out.

Variables

In the example above, we are simply placing the data into the script. This won't work in a real application, because you can't type in every single user's information that comes to your site yourself.

The best way to do this would be to use variables - these are containers for data.

Even with these variables, you'll still have to code it all yourself. Let's get the user to fill out some data themselves, with a form.

Here's a link to a basic form that you can download that will show a user's email address and name.

This is what will happen when you open that form in a browser 👇

Here's what the code looks like. We're taking what the user enters into the form, and adding them to the variables email and name.

To apply this to the messenger, we're going to create a form and use that to dynamically create users.

Go to this link, save it and open it up like before!

Insert your App ID

Don't forget to add your App ID as the value for the app_id attribute, otherwise the Messenger won't load.

This is what the code looks like to generate that 👇

Now we have another user in Intercom here! 👇

Try It

Add in your own user data in that form and see the users populating in Intercom!

Adding more data to our users

Intercom has a certain subset of standard attributes that we accept in your intercomSettings object.

These are attributes that all users, on any app in Intercom, will have. Examples of these standard attributes are user_id, email, name, created_at and so on.

But what if you want to send data that is unique to your application? That's where custom attributes come in (yay!).

Custom attributes act in the same way as standard attributes, but simply need to be declared differently.

Custom attributes need to be declared with " " wrapped around them, so Intercom knows it isn't a standard attribute. 👇

Our form now looks like this 👇

Going to our User List in the Platform, we can now make the new custom attribute visible like this 👇

Now we can see how many 'Direwolves' Jon Snow has!

Try It

Add some new custom attributes for yourself based on the data you want to know about your users.


What's Next

You've learned the basics - now get even more information about Intercom's Javascript library to really utilise your users data and customise the experience.

The Intercom JavaScript API

Installation Quickstart


Suggested Edits are limited on API Reference Pages

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