Implement a simple Intercom messenger as a custom component

Hi All,

I am trying to implement a simple intercom messenger on my retool app through a custom component.
here is the link of the intercom documentation to implement their messenger on a website.

Following is what my iFrame code looks like for a custom component

<script>  var APP_ID = "WORKSPACE_ID"; // Replace this with your workspace ID window.intercomSettings = {    app_id: APP_ID  };</script><script>(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='' + 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);}}})();</script>

Hey @zubair! Interesting idea. Are you running into any particular errors?

well, client want the chat button to be at the bottom right of the screen as you would expect a chat button on a website, but with retool we can’t do that it stays inside a custom component iframe

It is unfortunately not possible to add custom JS to the head of Retool itself to "install" intercom like you normally would on a website. All javascript inside of Retool is run in a sandboxed iframe, which would prevent things like intercom's install script from being added.

You could install intercom on a webpage, and then embed Retool inside of an iframe on that page. If you were to install intercom in a parent window and embed the Retool window inside of that page, then you could hide our intercom messenger by using this code in your preloaded CSS section:

body > div.intercom-lightweight-app {
display: none !important

Like this:

It will still show our icon on the settings pages of the organization, as the preloaded CSS isn't used there. But it would work for the homepage and any Retool apps!

1 Like

Quick update here. This is now possible if the Storage and cookies toggle is enabled on the Custom Component!

Hi folks -- this is now possible! See docs on adding your own Intercom chat to Retool.