Tawk.to Integration

Last modified on 2022/11/08 13:22

About This Integration

SAS_IntegrationNotRESTIntroduction

You can integrate third-party systems with Service Apps in many ways. The method you select will depend on business requirements, architectural and security constraints as well as the characteristics specific to each third-party application or service. You can use the REST, CSV, Online CSV data sources and the HTML Script widget.

This document describes a standard integration process that has already been implemented in a customer context.

To find out more about this integration, please do not hesitate to contact your EasyVista contact, or your service provider and integrator.

Integration Summary

Tawk.to is a free Live Chat software that does not contain spam or ads. Available in over 20 languages, it enables you to communicate in real-time with prospects, customers or visitors to your websites and apps, and engage them through their online experience.

This easy-to-implement integration enables you to insert a Tawk.to Chat widget directly into an Product name - ev sas.png app using a HTML Script widget.

You can also configure Tawk.to and Product name - ev itsm.png easily, for example, if you want to create incidents in Product name - ev itsm.png based on all chat transcripts and missed chat messages while offline.
 

Integration Data Feed (direction) Authentication Type Integration Connector Options

Product name - ev sas - big.png

Up and Down arrow.png

Logo - Tawk to.png

Down arrow.png

Product name - ev itsm - big.png

N/A

Product name - ev itsm.png SaaS Version

Product name - ev itsm.png On-Premise Version

Check icon.png

Check icon.png

SaaS Version of Third-Party Product

On-Premise Version of Third-Party Product

Check icon.png

Not check icon.png

Step-by-Step Integration Process

Embedding Tawk.to in Product name - ev sas - big.pngev Service Apps

Open url.png See the Tawk.to online help resources:

You can embed Tawk.to in Product name - ev sas.png in three easy steps:


Step 1: Check the list of requirements.

  • You must have a Tawk.to user account as well as the relevant login and password. If this is not the case, use the form to create a Tawk.to account. Validate and activate your new account by clicking the email link that will be sent to your email address.
             Open url.png See Creating a New Account.
  • To use the Chat widget, each new member must have a Tawk.to user account.
  • Your Product name - ev sas.png app does not have any property in your Tawk.to account.
  • Tawk.to lets you add several members to a property. These members can now communicate (via chat) with the visitors to the specified property and start a discussion using the Chat widget. You can add the email addresses of new members and assign the Agent or Admin role to them in the Admin > Property Members menu.


Step 2: Create a new property and a Tawk.to Chat widget and copy its JavaScript code.

1. Login to your Tawk.to account.

2. Create a new property by clicking Admin in the navigation bar at the top and specify the information in each step of the wizard. Note: If the wizard does not start automatically, click [ + ADD ] in the Admin bar to use the standard creation process.
         Tawk to - Creation wizard - Admin.png

     Step 1 - Site Information

  • Caution: In the Admin bar, the Site Name and Site URL fields can be modified.
  • Tawk.to provides unique identifiers (including a Site ID) for each property. The Chat widget code will depend on your property's unique ID.

          Tawk to - Creation wizard - step 1.png

  • Site Name: Name of the Product name - ev sas.png app where you want to add a Chat widget. You can enter a descriptive name that will identify your site and the corresponding property easily.
  • Site URL: App URL:
    • You can enter the part of the URL that identifies your platform (Base URI)
               Example documentation icon EN.png  https://mycompany-apps.easyvista.com
    • You can also enter the full URL (in design or execute mode) This enables you to identify the Product name - ev sas.png app associated with the property easily if you inadvertently modify the Site Name field.

      Note: Product name - ev sas.png apps will display:

      • In design mode, the following type of URL https://mycompany-apps.easyvista.com/index.php?timestamp=1474643995412&name=com.mycompany.57e4f6483d9bc&studiomode 
      • In execute mode, the following type of URL https://mycompany-apps.easyvista.com/index.php?timestamp=1474644039302&name=com.80007.57e4f6483d9bc|555c55c0ac965&showapp=0

      The value shown after the timestamp parameter will change systematically, but the last sequence of numbers identifying the app in a unique way will remain unchanged.

     Step 2 - Invite Agent
          This step is optional. You can click [ SKIP THIS STEP ] if required.
         Tawk to - Creation wizard - step 2.png

  • You can add the email addresses of other users in addition to those you used to create your Tawk.to account.
  • You can assign the Agent or Admin role to these users. Note: Agents whose role is Admin role will be authorized to configure your app's Chat widget.
     

     Step 3 - Install Chat Widget
          Copy all of the JavaScript code outlined in red.

Note: You can send this code by email to the person in charge of embedding the Chat widget in the Product name - ev sas.png app by clicking [ EMAIL THESE INSTRUCTIONS TO MY WEB DEVELOPER ].

          Tawk to - Creation wizard - step 3.png

3. Click [ DONE ] to finish creating the new property associated with your Tawk.to account.

4. To view details on the property, select the property and click Wheel icon.png [ PROPERTY SETTINGS ] in the Admin bar. Each property is identified by a Site ID, an API Key and a Ticket Forwarding Email which are uniquely associated with the property.
         Tawk to - Modify property.png


Step 3: Paste the JavaScript code into the Product name - ev sas.png app to display the Tawk.to Chat widget.

PasteJavaScriptCode

1. Go to Product name - ev sas.png and open the app you want.

2. Use a HTML Script widget to display the Chat widget:

  • Click Apps - Add widget icon.png in the Objects pane. Open the Basic category and click and drag the HTML Script widget to the Design pane.

    Best Practice icon.png You can place the HTML Script widget anywhere on the page because the Chat widget will appear by default at the bottom right of the user's screen. Nevertheless, to find it quickly without searching for the widget by name, you can insert it at the bottom of the page.

  • Rename the widget so you can identify it easily.
  • Paste the JavaScript code obtained in step 2 in Theme > Footer > Footer and check the Display box.

    Best Practice icon.png  Paste the code of the Chat widget in the Header or Footer section instead of the HTML Code field. This enables the Chat widget to be displayed without being restricted by the height of the HTML Script widget and to appear on all app pages.

Note: In some cases, you can also use the Secured Html widget and paste the JavaScript code directly in the Html Code field.

3. Click EVApps - GUI - Execute icon.png to switch to preview mode and check the visual layout and workability of the Chat widget.

Embedding Tawk.to in Product name - ev itsm - big.pngev Service Manager

Open url.png See the online help resources:

You can embed Tawk.to in Product name - ev itsm.png in three easy steps:


Step 1: Check the list of requirements.

  • You must have a Tawk.to user account as well as the relevant login and password. If this is not the case, use the form to create a Tawk.to account. Validate and activate your new account by clicking the email link that will be sent to your email address.
             Open url.png See Creating a New Account.
  • You must have an email account, e.g. Exchange, dedicated to the Tawk.to and Product name - ev itsm.png integration.

    Note: The emails of this email account will automatically be deleted by the Technical Support Agent once they have been processed.

  • You must have an account for accessing your Product name - ev itsm.png platform with the relevant profile and access rights to access the Administration > Technical Support Agent menu.


Step 2: In Tawk.to, configure the sending of emails to be processed by the Technical Support Agent.

1. Login to your Tawk.to account.

2. Click Admin in the navigation bar and select Mail Notifications.
         Tawk to - Configure email sending 1 - step 1 ev itsm

3. Enter the email address of the email account used by the Technical Support Agent and click [ SAVE ].

Example documentation icon EN.png  If you want to create incidents in Product name - ev itsm.png based on chat transcripts and missed chat messages while offline, you should configure Tawk.to by entering the email address of the email account used by the Technical Support Agent in this integration.
         Tawk to - Configure email sending 2 - step 1 ev itsm

Note: The sending of chat transcripts and mail notifications works even if the None option is selected.


Step 3: Configure the Technical Support Agent in Product name - ev itsm.png.

Note: Contact your Service Desk or your Windows/Exchange administrator if you do not know the POP3/IMAP4 account settings you should use for this integration.

1. Select Administration > Technical Support Agent in the Product name - ev itsm.png menu.

2. Click Add icon.png to add a new mailbox.

3. Enter the information on the email account dedicated to the Tawk.to and Product name - ev itsm.png integration.

Caution: Select the Create Unknown Requestors box to create incidents automatically.

          Example documentation icon EN.png  Outlook Office 365 email account
         Tawk to - Example configure ast - step 3 ev itsm.png

4. Display the list of incidents and check that the relevant incidents have been correctly created.
         Tawk to - Verify incidents list - step 3 ev itsm.png

Note: Tawk.to will display the URL of documents attached to chat transcripts. The attached documents are hosted on the Tawk.to SaaS platform. You can view them at any time using the Web browser.
         Tawk to - Verify incident url - step 3 ev itsm.png

Use Case

UseCaseTawkTo

The tawk.to Chat widget is integrated in the Standard Service Workplace template. To use it with this template, you should simply use your own tawk.to account and replace the JavaScript code with the one corresponding to the property created for your app.

Tags:
Powered by XWiki © EasyVista 2022