Help with calling Intercom Bot from an Enfold Button Row

Hello,

I am working on a redesign of our home page, and a key requirement is to replace forms with an Intercom Bot that allows visitors to book a demo of our software.

I have followed the Intercom guide to create a custom CSS ID called .book_demo_bot and used the Developer Settings in the Button Row object, I have assigned the ID. In order to prevent the page from reloading, I have set the link to manual and just added ‘#’.

I then copied the Button Row object and inserted it in two other places on the page to prompt a call to action.

As you will see on the page, the first instance calls the Intercom Demo Bot as required, but the others on the page ignore the javascript and use the # to revert back to the top of the website.

The other issue I have is that the Button Row component only allows you to set Developer Settings for the component and not the individual buttons, so when selecting the ‘watch a demo’ button it attempts to call the Intercom Bot before loading the eWebinar demo page.

I have attempted to replicate the style and responsive behaviour of the Button Row using individual buttons, but this has proved unsuccessful. If this had worked then the second issue would be resolved as each button would have its own Developer Settings so I could set the CSS for the ‘request a demo’ button only.

Any advice or suggestions would be greatly appreciated.