Answered

How can I change the Messenger logo?


Userlevel 2
Badge

Can I use a different logo for the Messenger? I don’t want to use the default Intercom one.

icon

Best answer by Anonymous 19 October 2020, 16:50

View original

10 replies

Userlevel 1

If you’re a Premium or Scale customer, you can add a custom logo for the Messenger instead of the default logo. In the “Style your Messenger” section of Messenger Settings, you’ll see an “Upload your logo” button. For the best results, use a PNG or GIF with a transparent background.

 

Alternatively, you can also create a “custom launcher” (i.e. a CSS element on your site that, when clicked, launches the Messenger). This guide will show you how to create a custom launcher.

Hi @eric f11​, question about the custom launcher via CSS element and integration with Google Tag Manager. I am looking to replace my custom install tag using GTM with the (new, I think) templated tag installer in GTM to take advantage of some of the new intent methods available. However, on preview, the new way of installing is conflicting with my custom launcher. You can see my custom launcher at 800goldlaw.com. Setting the intercom launcher to display:none using CSS also eliminated the <a id=""> I utilize to display the custom launcher, so I'm not sure what to do. If there a guide or tips article somewhere for integrating a custom launcher with the new GTM template install tag?

Userlevel 1

Hey @tom c​, as far as I know it's not possible to build a custom launcher if you're installing the Messenger via GTM (trade offs!), but I'll double check this for you 👍

Hey @tom c​ , that should be totally doable.

First, the new(!) GoogleTagManager integration is a wrapper around our Messenger JavaScript API and should allow for the exact same capabilities.

Specifically - you can pass "custom attributes" through GoogleTagManager, which is equivalent to manipulating the `intercomSettings` variable in JS.

You can use `custom_launcher_selector` attribute to specify your custom launcher element - full documentation.

Please let us know if you need further help with this.

OK, got it! So I can use the "Custom Data Attributes" section to manipulate the available intercomSettings var...is that limited only to messenger settings, or no? Also, how would I use this same tag to submit and track https://developers.intercom.com/installing-intercom/docs/intercom-javascript"alt="http://https://developers.intercom.com/installing-intercom/docs/intercom-javascript"target="_blank">JS events? Finally, the Data Attributes section in the new GTM tag template is ONLY available for users, right? No way to capture the custom attributes I've created for visitors in Intercom in GTM as a data layer, for example? Thank you!

  1. Not limited to messenger settings - anything you add there would be added to `window.intercomSettings`.
  2. To track events - use the "track event" method of the tag
  3. The data attributes would apply to the current visitor (wether it's a visitor/lead/user) - note this comment from the documentation: When user_id / email is provided, it will be saved as a User record
  4. If you have other attributes you'd like to assign to a visitor/lead - using the data layer is encouraged:
    1. Once the values are set (and available as data-layer variables) -
    2. Trigger an instance of Intercom's GTM tag - you can use the method "update" to add more attributes
    3. Use "custom data attributes" to pass in your custom attributes - you can use GTM variables for both the "key" and the "value" pieces of the "custom attributes" (i.e. I added a "nickname" attribute - in this case the "key" is the static value "nickname" and the value is linked to a data-layer variable {{ nickname }})

Hope this all makes sense :)

 

Yeah, that's really powerful! I'm getting a lot of great ideas for using page content/landing pages/conversions actions and intentions on site to create, assign, capture visitor data and present options/ideas to keep visitor engaged. I love the idea of launching the chat when user attempts to exit. So cool. Thank you!

@eric f11​ What did you find out? Do we need to abandon GTM if we want to have a mix of sitewide and custom-launcher approaches? (We have the "generic" install for our main site on Webflow but we want to add the ability to do a custom launcher on a landing page which is not navigatable from the main site.)

Hi @burke​ ,

This is 100% doable with GTM - you can choose 3 ways to achieve this:

  1. When using the "install" method of our tag - include the "custom_launcher_selector" attribute as "custom data attribute" (part of the method's arguments) - this is the same as documented here: https://developers.intercom.com/installing-intercom/docs/javascript-api-attributes-objects(see Messenger Attributes).
  2. Use methods `Show` and `Hide` of our tag with GTM to show/hide whenever you'd like (based on GTM triggers)
  3. Directly in JS, call "window.Intercom('Show')" and "window.Intercom('Hide')" when your custom launcher is clicked (https://developers.intercom.com/installing-intercom/docs/intercom-javascript

Our GTM tag is a wrapper around our JS API (linked above). You can use them together interchangeably - mix and match.

Please let us know if we can help you further!

Thank you @Alon Regev​. We'll give this a try. Wish us luck!

Reply