# Intercom

To use an [Intercom](https://intercom.com) chat widget to chat with your customers, and correctly pass the customer information to Intercom you can follow these steps:

### Setup

{% stepper %}
{% step %}
**Find your Workspace ID (App ID)**

You need to find your Intercom App ID to customize the code snippet in Step 2 and make this integration work.

<img src="https://319575345-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MifpIQWu0HCVYAt51oT%2Fuploads%2Fgit-blob-111bc9a5331cd7ba30960a9a56ecd3ed0adf325b%2Fexamply_workspace_id.png?alt=media" alt="" data-size="original">

You can find your Workspace Id (or App id) by going to your Intercom settings page:

<https://app.intercom.com/a/apps/_/settings/workspace/general>
{% endstep %}

{% step %}
**Add your Code Snippet**

Next, go to the "Custom Code" section of your portal settings and enter the following code in the `Header Code` section or from here: <https://portals.noloco.io/~/_/settings/custom-code>, replacing `<YOUR_APP_ID>` with the value you found in the first step

```html
<script type="text/javascript">
  // These two blocks prevent the Noloco intercom widget from loading
  window.loadIntercom = () => null;
  window.intercomLoaded = true;
  
  // You can put any custom settings in here
  // but you need this to override the Noloco Settings
  window.intercomSettings = {};   

  var APP_ID = '<YOUR_APP_ID>';

  (function(){var w=window;var ic=w.Intercom;if(typeof ic==="function"){ic('reattach_activator');ic('update',w.intercomSettings);}else{var d=document;var i=function(){i.c(arguments);};i.q=[];i.c=function(args){i.q.push(args);};w.Intercom=i;var l=function(){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);}}})();

  window.Intercom('boot', {
     app_id: APP_ID,
  });

  function setIntercomSettings(user) {
    window.Intercom('update', {
     app_id: APP_ID,
      id: user.id,
      name: user.firstName + " " + user.lastName, 
      email: user.email, 
      company: user.company.companyName, 
      // Add other values here
    });
  }

  window._NolocoOnLoadUser = setIntercomSettings;
</script>
```

{% endstep %}

{% step %}
**Publish your Noloco Project**

Finally, publish your project so that this is picked up when your users load your app.

If there are other details you need to send to Intercom be sure to request them in the app, and then just update the `window.Intercom('update', ....)` function call with whatever values you need.
{% endstep %}
{% endstepper %}

### More information

For more information on integrating Intercom you can read their help article:

<https://www.intercom.com/help/en/articles/170-integrate-intercom-in-a-single-page-app>

If you have any other issues getting started with Intercom you can learn more in their Frequently Asked Questions:

<https://www.intercom.com/help/en/articles/8771110-getting-started-faqs>


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://guides.noloco.io/integrations/intercom.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.