How to create a website channel in Yuzap

This guide explains how to create and configure the Website Inbox and how to use the additional settings of the website channel.

Objective: by the end, you will have the chat widget installed on your site, agents assigned and the options (business hours, CSAT, pre-chat etc.) adjusted.

Compatibility and requirements

Browsers (web dashboard and widget):

  • Mozilla Firefox v52+

  • Google Chrome v57+

  • Chromium v57+

  • Apple Safari v14.1+

  • Microsoft Edge v16+

Yuzap mobile app:

  • Android v5.0+

  • iOS v11.0+


How to create a Website channel in Yuzap

  • Go to: Settings → Inboxes → Add inbox.

  • Choose the type: click the icon "Website".

  • Fill in the site details (details below).

  • Add agents to the website inbox.

  • Install the widget on your site (copy/paste the code snippet).

  • Manage agents and review the code in Settings → Inboxes → Settings of the created inbox.

Conversations only will be routed to agents who are associated with the inbox. Even administrators need to add themselves as agents.

Available fields (when creating the channel)

  • Site name Ex.: Example Inc.

  • Site domain Ex.: www.example.com

  • Widget color Select the color from the palette to customize the widget.

  • Welcome title Ex.: Hello 👋

  • Welcome slogan Ex.: We are here to help. Ask us anything!

  • Enable channel greeting Enables/disables sending the automatic greeting when the customer starts the conversation.

  • Channel greeting message Ex.: "Hello! How can we help?"

After filling in, click Create inbox.


Add agents

  • In Collaborators of the inbox, select the Agents in the menu and click Add agents.

  • If they do not exist yet, create the users/agents and then assign them to the inbox.


Step 5 — Install the widget on the site

  • On the inbox page, copy the code snippet (script) and paste into the root file of your site (near the closing of </body>).

  • Use the Copy button to make it easier.

Shortcuts after creating the inbox:

  • More settings → takes you to the Additional settings of the inbox.

  • Take me there → opens the newly-created Inbox.


Step 6 — Review/update agents and code

  • Go to Settings → Inboxes, find the website inbox and click Settings.

  • You will see the widget snippet and the list of agents with access.


Additional Inbox Settings (Website)

Access Settings → Inboxes and click the gear icon of your inbox.

Tab Settings

  • Notifications: scroll to choose what you want to receive when the inbox is active.

  • Email collection (enabled by default): displays a prompt asking for email when the customer starts the conversation.

  • CSAT (Satisfaction Survey): when enabled, triggers the survey when a ticket is resolved (results in Reports).

Click Update to save.


Tab Agents

  • Add or remove agents from the inbox.

  • Automatic assignment: enable/disable to distribute new conversations automatically among the agents of this inbox.

Click Update to save.


Tab Business hours

  • Check Enable business availability for this inbox if you have defined hours.

  • Configure:

    • Out-of-office message (displayed to the customer).

    • Days/hours of service and the correct timezone .

Finish with Update Business Hour Setting.


Tab Pre-Chat Form

Collects information before the conversation starts (in the website widget).

  • Enable pre-chat form: Yes/No

  • Pre-chat message: e.g.: Hello! We need some information to serve you better.

  • Form fields: check the required ones.

Default fields: Name, Email, Phone. Other fields require creation of Custom attributes in advance.

Click Update to save.


Tab Widget Builder

  • Customize the widget with the available options and preview changes in real time (preview).


Tab Setup (installation script)

  • Find here the code snippet of the widget to copy and paste into your site.

  • Use the Copy button to make it easier.


Done! Your live chat is set up. Test it on the site, send a message and confirm if it appears in your Conversation list in the Yuzap dashboard.

Last updated