Noloco
Ask the CommunityHire an ExpertLoginSign up
  • Noloco Overview
  • 🚀Quickstart
    • Start with your data
    • Start with AI
    • Start with a template
  • Data to App
    • Database Consolidation
  • App Settings
  • Components
    • Containers
    • Video
  • Templates
  • 🔗Data Sources
    • Data Overview
      • Setting a Collection's Primary Field
      • Syncing
    • Noloco Tables
      • Field Types
      • Relationships
      • Automatic Links
      • Rollup Fields
      • Lookup Fields
      • Formulas
      • Noloco AI
      • Import a file
    • Airtable
    • Google Sheets
    • SmartSuite
    • MySQL
    • PostgreSQL
    • REST APIs
    • HubSpot
    • Xano
  • 📄Pages
    • Collection views
      • Show collection record count
      • Empty State
    • Blank pages
    • iFrame embeds
    • External links
    • The Home Page
    • User Profile Page
    • Parent pages & folders
    • Page visibility rules
    • Cloning pages
    • Renaming pages
    • Hiding pages
    • Sidebar dividers
    • Tabs
  • 📂Collections
    • Adding collection views
    • Display
      • Rows
      • Cards & columns
      • Tables
      • Kanban boards
      • Calendar
      • Timeline
      • Gantt
      • Split-view
      • Charts
      • Maps
      • Pivot Table
      • Single record view
      • Grouping records
      • Record Colors
    • Filters
      • Logged in user
      • Relative Filters
      • Record values
    • Filter fields
    • Sort & limit
    • Row Action
    • Column Summaries
  • 📝Forms
    • Forms
      • Customizing Form Fields
      • Passing Linked Record Values to a Form
      • Dynamic Form Field Filters
      • E-Signature Fields
    • Public Forms
  • 📃Record Pages
    • Overview
    • Visibility Settings
    • Hidden Field Values
    • Record Comments
  • ✏️Field Formatting
    • Field visibility conditions
    • In-line editing
    • Conditional Highlight Colors
    • Dates & Time Zones
  • 📊Charts
    • Overview
  • 📂Data Management
    • Export Data
    • Import Data
  • 👥Users & Permissions
    • User Table
    • User Management
    • User Roles & Permissions
      • Record-level permissions
      • Field-level permissions
    • Open Sign Up
    • Offboarding Users
    • Testing as other users
  • ⏩Actions
    • Action buttons
      • Create records
      • Update records
      • Bulk actions
      • Barcode Scanner
      • Add a Comment Action
  • ⚡Workflows
    • Workflows
      • On-demand workflows
      • Comment Added Trigger
      • Watched Fields
      • Trigger webhooks
      • Send automated emails
      • For each item in a list...do...
      • Only continue if
      • Create a Record Action
      • Update a Record Action
      • Delete a Record Action
      • Deactivate a User Action
      • Reactivate a User Action
      • Send an Invitation Email Action
      • Add a comment to a record
      • Send a Push Notification
      • Ask Chat GPT Action
      • Summarize Text Action
      • Correct Grammar Action
      • Extract Keywords Action
      • Analyze Sentiment
      • Finish Text Action
      • Send a message to a Slack Channel
      • Send a message to a Slack User
      • Generate a PDF with DocsAutomator
  • 🔔Notifications
    • Notifications
    • Notification Preferences
  • 📑API Documentation
    • API Overview
      • Fetching Records
      • Fetching a Record
      • Creating a Record
      • Update a Record
      • Deleting a record
  • ⚙️Settings
    • General Settings
      • Live Mode
      • Custom Logos
    • Theme & Design
    • Progressive web apps
    • Navigation Settings
    • Spaces
    • Email Settings
    • Custom Code
    • Custom Domain
    • Login & Signup
      • Sign in Options
      • Single Sign On
      • 2FA - Two Factor Authentication
      • Client Portal User Add-On
    • Login Screen
    • User Lists
    • Integrations & API Keys
    • Billing & Usage
    • Support
    • Publishing
      • App Version History
  • 🔄Integrations
    • Zapier
    • Make (Integromat)
    • Sign in With Google
    • Intercom
    • SMTP Emails
    • Documint
  • ⚙️Account
    • Workspaces
    • Pricing
      • Client Portal Add-on (Legacy)
    • Transferring an App
    • Onboarding Call Preparation
Powered by GitBook
On this page
  • Setup
  • More information
  1. Integrations

Intercom

Learn how to setup Intercom in Noloco

PreviousSign in With GoogleNextSMTP Emails

Last updated 5 months ago

To use an chat widget to chat with your customers, and correctly pass the customer information to Intercom you can follow these steps:

Setup

1

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.

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

2

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, replacing <YOUR_APP_ID> with the value you found in the first step

<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>
3

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.

More information

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

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

🔄
Intercom
https://app.intercom.com/a/apps/_/settings/workspace/general
https://www.intercom.com/help/en/articles/170-integrate-intercom-in-a-single-page-app
https://www.intercom.com/help/en/articles/8771110-getting-started-faqs