Developers

Search

Adding Intercom to your site

Elevate your Framer site by integrating Intercom to enable live chat, support ticket submissions, chatbot automation, and outbound messaging.

How to add Intercom to your site

  1. Set up Intercom Messenger

  1. Copy your workspace ID

  • Locate your workspace ID in the browser URL when logged in to your Intercom account. For example, in the URL below, the workspace ID is o0ma3k8s:https://app.intercom.com/a/apps/**o0ma3k8s**/guide-library.

Add the Intercom component in Framer

  • Open your project in Framer and click Insert in the top navigation to open the Insert panel.

  • Find Intercom in the Integrations section and drag the Intercom component onto your canvas.

The main panel displays embed integrations such as Intercom.

Paste your workspace ID

  • Select the Intercom component on your canvas. In the properties panel on the right, paste your workspace ID into the ID field.

The 'Intercom' section features a field for entering a workspace ID, with a link to learn more about creating an Intercom account.

Preview or publish your site

  • The Intercom component will display a placeholder in your Framer canvas, but this will not appear on your live site.

  • Preview or publish your site to see the Messenger in action.

If you’re having trouble finding the Messenger on your site, follow these troubleshooting steps.

Favorite use cases for Intercom in Framer

  • Engage leads and clients: Add Intercom's Business Messenger to connect with visitors in real time.

  • Leverage automation: Use powerful chatbots to handle common queries and automate workflows.

  • Streamline support: Centralize support requests, making it easier to manage and respond to customer inquiries efficiently.

How to add Intercom to your site

  1. Set up Intercom Messenger

  1. Copy your workspace ID

  • Locate your workspace ID in the browser URL when logged in to your Intercom account. For example, in the URL below, the workspace ID is o0ma3k8s:https://app.intercom.com/a/apps/**o0ma3k8s**/guide-library.

Add the Intercom component in Framer

  • Open your project in Framer and click Insert in the top navigation to open the Insert panel.

  • Find Intercom in the Integrations section and drag the Intercom component onto your canvas.

The main panel displays embed integrations such as Intercom.

Paste your workspace ID

  • Select the Intercom component on your canvas. In the properties panel on the right, paste your workspace ID into the ID field.

The 'Intercom' section features a field for entering a workspace ID, with a link to learn more about creating an Intercom account.

Preview or publish your site

  • The Intercom component will display a placeholder in your Framer canvas, but this will not appear on your live site.

  • Preview or publish your site to see the Messenger in action.

If you’re having trouble finding the Messenger on your site, follow these troubleshooting steps.

Favorite use cases for Intercom in Framer

  • Engage leads and clients: Add Intercom's Business Messenger to connect with visitors in real time.

  • Leverage automation: Use powerful chatbots to handle common queries and automate workflows.

  • Streamline support: Centralize support requests, making it easier to manage and respond to customer inquiries efficiently.

FAQ

  • How do I add Intercom to my Framer site?

    To add Intercom to your Framer site, first sign in to your Intercom account and ensure the Messenger is installed and enabled. Then, open your project in Framer, click 'Insert' in the top navigation, find 'Intercom' in the Integrations section, and drag the Intercom component onto your canvas. Next, locate your workspace ID in your Intercom account URL and paste it into the ID field in the properties panel. Preview or publish your site to see the Messenger in action.

  • Where can I find my Intercom workspace ID to use in Framer?

    You can find your Intercom workspace ID in the browser URL when logged in to your Intercom account. For example, in the URL 'https://app.intercom.com/a/apps/o0ma3k8s/guide-library', the workspace ID is 'o0ma3k8s'. Copy this ID and paste it into the Intercom component's ID field in Framer.

  • Why can't I see the Intercom Messenger on my live Framer site?

    The Intercom component will display a placeholder in your Framer canvas, but this will not appear on your live site. To see the Messenger in action, you need to preview or publish your site. If you're still having trouble finding the Messenger, follow the troubleshooting steps provided by Intercom.

Updated

Related articles

Adding Mailchimp to your site

Adding Marketo Forms to your site

Adding Meta Pixel to your site

Adding Typeform to your site

Connect Framer forms to a webhook