Talk widget

The Talk widget page is where you manage the Talk messenger widget, including turning it off and on.

The messenger widget is the widget for Ortto’s Talk feature which enables live conversations with your customers on your website. Enabling the widget widget allows your website visitors and customers to contact your organization to receive customer support or ask questions of your sales team.

Conversations initiated by a customer or visitor using the talk widget are managed by agents using the Talk inbox.

The web page on which you want the talk widget to appear must have your Ortto tracking code installed.

If you website enforces a content security policy (CSP), you will need to configure it to support the Talk messenger widget.

This page describes the Talk messenger widget which captures inbound conversations (initiated by a contact/visitor). You can build upon the Talk messenger widget by creating a conversation capture widget, which uses the Talk messenger widget to initiate conversations with contacts or visitors to your site (outbound conversations), such as to announce new products or offer help to site visitors. Learn more about initiating conversations in Conversation capture widget.

To access the Talk messenger widget settings, navigate to Settings  Talk widget. You’ll be taken to the widget manager, where you can enable (toggle ON) or disable (toggle OFF) the widget on any page that has the tracking code installed.

If you want to have the widget turned ON, but not shown on every page which has the tracking code installed, add disableTalk: true to the initialize function of the relevant page’s tracking code. Learn more under Hide the Talk widget when enabled at Tracking code.

Click Edit to configure how the widget looks, how to handle unidentified visitors, and set response times.


The chat widget includes a homepage, which is what visitors see when they start a conversation. Here you can customize the look of the widget homepage to suit your branding.

Add a logo to represent your brand, and set the widget colors and font family.

Preview your agent’s photos and add a bot photo for auto-reply messages.

You can customize the icon that represents the widget when it is minimized on your webpage. By default the widget sits in the bottom-right corner of your webpage, but you can change this using the position and margin options.


You can personalize your widget header using merge tags to greet known users by name (e.g. by adding the First name person field merge tag).

The Widgets section lists the components of the chat widget, with Conversations added by default (edit this section under the Conversations tab). Click Add widget to add a Quick links section and add relevant links to key areas of your website, such as "Book a demo" or "Shipping and returns".

widget settings
Example Talk widget homepage settings


Unidentified visitors

Configure the requirements for identifying unidentified visitors.

When an unidentified visitor starts a conversation, by default and at minimum they will be required to enter an email address. You can also specify that the visitor also enters their first and last names.

Where a conversation is initiated by a conversation widget, an unidentified visitor can reply to the widget-initiated message without needing to provide their details. However, if the visitor wishes to continue the conversation, then they will need to provide at least their email address (depends on your settings for unidentified visitors).

An unidentified visitor will become a CDP contact when they have entered their details (email address at minimum) and begin a conversation.

Contacts who are known, such as where they have logged in to your website and the tracking code can recognize them by their email address, will have their name displayed in the chat widget header. A logged-in/known contact also will not have to provide any identifying information, such as an email address, when they initiate a conversation.

known contact talk widget
Example contact’s name displayed in the widget header

Response times

Let visitors know about your expected response times for when you are online (active) and away. The online and away response estimates will appear in the talk widget homepage and in conversation auto-replies (depending on your away/online status.

Content security policy (CSP) configuration for Talk

If your website enforces a content security policy (CSP), you will need to configure it support the Talk messenger widget.

How you modify your CSP depends on its specification level (1, 2 or 3) and your website’s configuration.

Where you have a level 3 (strict) CSP, you need to configure the policy directives to include a nonce directive to "whitelist" your inline script element, similar to the following:

object-src 'none'; script-src 'nonce-{random}' 'unsafe-inline' 'strict-dynamic' https: http:; base-uri 'none'; report-uri

Where your CSP is a level 1 or 2, you can enable Talk by allowing JavaScript to communicate over web sockets with the Talk API by modifying your CSP header to include a connect source. Talk uses Twilio and the twilio-video.js library to facilitate audio calls and screen sharing, so you need to tell the CSP to allow Twilio’s servers:

connect-src 'self' https: wss:// wss:// wss://;

An external resource for learning more about connect-src is here: CSP: connect-src.

The Talk API endpoint is region-specific, so you need to match it to the your instance region (the instance where your are running Talk).

The regional endpoints are:

As Talk includes audible alerts to notify agents and users of new messages, you need to permit Talk in your CSP’s media source using the data: scheme. If media-src is not explicitly set, it will fallback to your default-src. A source for data: is not required (e.g. you do not need to add the Talk API URL).

As mentioned above, talk uses Twilio and the twilio-video.js library to facilitate audio calls and screen sharing. Per Twilio’s twilio-video.js documentation the mediastream: protocol is required at your media source:

media-src: 'self' https: data: mediastream:;

More information on data: and mediastream: can be found here (external resource): CSP source values: sources.

Use caution when making changes to your CSP to avoid issues affecting your website’s JavaScript.

As each website’s CSP is configured differently, check with your development team to ensure your CSP is configured appropriately to support Talk. You can also contact Ortto’s Support team if you need assistance.