Tidio

How To Integrate HelloScreen With Tidio

Here are the steps to integrate HelloScreen with Tidio.

The objective is to create a screen-sharing link within Tidio to instantly screen-share with a customer when they need help.

Below you can see how the screen-sharing link appears on the right-hand side of the chat panel.

How to create your own screen sharing link within Tidio

Step 1

Add the Upscope javascript snippet to all the pages you wish to screen share on. You can find your Upscope snippet within your settings under installation: https://app.upscope.io/install

Step 2

Create a new contact property within Tidio > settings > Contact properties https://www.tidio.com/panel/settings/contact-properties

Choose URL as the property type.

Name it Screen sharing or whatever you prefer.

Below we've labelled the contact property as 'Screen sharing" and the internal property name is "screen_share".

Step 3

To enable contact properties within Tidio you need to add some extra code to your pages.

Please be sure that the contact property name you set up is identical to the property you add to the code. Below you can see we've used "screen_share".

<script type="text/javascript">
		
(function() {
  function onTidioChatApiReady() {
    // Code after chat loaded
	Upscope('getWatchLink', function(link) {
		   tidioChatApi.setContactProperties({
		  screen_share: link,
		});
	});
}
  if (window.tidioChatApi) {
    window.tidioChatApi.on("ready", onTidioChatApiReady);
  } else {
    document.addEventListener("tidioChat-ready", onTidioChatApiReady);
  }
})();
</script>

What does this code do?

It waits for the Tidio chat to load.
It then uses the Upscope getWatchLink function to generate a unique URL for that user's screen which you can use to screen share.

Now, for all new chats, you'll see a screen share link appear within the Tidio chat panel. Please be sure to refresh both Tidio and the client side if you're testing.

When you're in a chat with a customer you can copy and paste that screen sharing link into a new tab to begin screen sharing. By default it will ask for permission. You can make changes to the messages and permissions within your settings.

It's not a clickable link at present. We hope that Tidio will allow clickable links in the near future.

Message us on our chat if you need help.