Question

Product tour not detecting the data-intercom-target key

  • 7 October 2022
  • 3 replies
  • 76 views

For some reason the Product Tour build is not recognizing the data-intercom-target key in the right place, as you can see the pink line on the top left corner of the screen shot. Any ideas? I added the key in other places and works fine, I have the problem only when adding the key to the items inside the menu, on the left side, where the background color is black.

 

Screen Shot 2022-10-07 at 16.41.19


3 replies

Userlevel 4
Badge +5

Hello @jeann​ 

In order to help you, I'll need to see the code. Can I create a test account for that app?

It's probably that the menu is dynamic, expand-collapse kind of menu maybe, so the exact HTML element you selected is just something that holds everything in, but the actual content is then positioned outside of it via CSS. It's hard to say without looking at the code...

Thanks @user382​ ! Your comment opened my eyes. The menu is being used as a component, and I have one menu fixed, for the browser version, and another menu for the mobile version, as a slider. Both menu items had the same data-intercom-target key, so that was the problem.

Userlevel 4
Badge +5

@jeann​ glad that helped! 🙂

 

Yesterday one of my Intercom clients asked me "How technical a person should be to be able to create Product Tours? Do I need a developer for that? Is it a no-code solution?" and I explained that it is not needed to have a developer if the person building it understands HTML/CSS. And understanding the CSS structure used by the devs, so that it works for all the users you need it to work (sometimes dynamic CSS classes create challenges). And lot's of testing 🙂

Reply