Allow chat icon to be text and positioned within a menu, rather than the fixed circle widget

[Bandsome]

The live chat circle widget can get in the way and the lack of customising should be addressed.

For example, we would prefer our live chat to be more discreet and hidden in a dropdown menu. The user can then click the 'live chat' text and the chat box opens on click. See attached image as an example. 

Is there any way currently to do this?

Thanks

[Willson]

Hey @Bandsome 

I do not have a specific example that works with the menu like you've outlined in your screenshot here but our Conversations Widget SDK can be used to control how the Chat Widget works on your page.

As an example, you can have the chat widget hidden by default but upon a button click, you can call a function to load this widget in an widgetOpen: true state. Take a look at the sample code here:

<script type="text/javascript">

                function myFunction() {

                  var emailInput = prompt("Please enter Email");
                    if(emailInput) {
                          var _hsq = window._hsq = window._hsq || [];
                          _hsq.push(["identify",{
                            email:emailInput,
                            api: "True"}]); //Identify User
                          _hsq.push(["trackEvent",{
                            id:"User asked for Support"}]); //Track Event
                          /*
                            Load Chat Widget in Open State
                          */
                          const status = window.HubSpotConversations.widget.status();

                              if (status.loaded) {
                                window.HubSpotConversations.widget.refresh();
                              } else {
                                window.HubSpotConversations.widget.load({ widgetOpen: true });
                              }
                        }
                  }
            </script>

In this particular example, this function is called when a user clicks a button 'Get Support', it then pops a simple prompt looking for an email which then allows me to run our identify a visitor code and load the chat widget in an open state as per the docs I linked above. 

I hope this helps!

[Bandsome]

Hi Matthew,

Thanks for your thorough reply.

Awesome I'll give it a test and see how it works. Sounds like it should do the trick.

Cheers,

Dave