Staff Directory With Embedded Live Chat

Staff Directory With Embedded Live Chat

In this blog post, I will show you how to create a ‘Staff Directory  – Live Chat Link’ to use for every staff member in your organization. Whether you are an educational institution, or have an organization with multiple employees, you will most likely have a staff directory containing an alphabetical index of the names, departments or a particular category of people. Now days, these staff directories are accessible online for students, employees, and faculty members to have quick access to individuals that they would like to contact. If your organization utilizes Skype for Business, then you can take advantage of Enabling WebChat and offer a live chat service for every faculty member in your staff directory. This is a great way to utilize your existing Skype for Business service and at the same time make yourself easily accessible to your students, employees and customers. Individuals will have a convenient way to communicate with their contact person through Live Chat. By enabling individuals to have quick access to communication, you eliminate the need for them to dial a phone number, wait on hold, or to be transferred. Live Chat will increase commination satisfaction and reduce the cost of other communication services. Each staff member can take as many live chat conversations and they can handle.

Here is what it looks like to offer a live chat service in your staff directory:

In the WebChat Admin Dashboard, you can create multiple chat windows for each of your staff members. These are called WebChat Pages. Each WebChat Page can have its own look and feel as well as its own settings. When a WebChat page is created, it will also create a link that will be accessed using a web browser. This is the hyper link that you will put into your staff directory.  Each staff member will have its own page created and its own link to embed into the directory.

In the below example I have created a page for Vanessa Smith. 
(This is the chat form that an individual will see once they have clicked the “Live Chat” button in your staff directory.)

 Staff Directory Live Chat Window 3

The individual will need to fill out a little information about themselves on this form before clicking the “Chat Now” button. Once the chat button is clicked, the staff member will receive a notification in their Skype for Business client that they will need to accept before collaborating in a “two way live Instant Message” conversation.

Here is an example of what the two way conversation between the Individual and the Agent will look like. The Individual’s chat conversation is on the left and the Staff Member’s conversation window is on the right.

Staff directory live chat conversation windows

How to embed a Live Chat link inside a staff directory:

If you haven’t already signed up for a free 30 day trial, you can do that here.

  1. Sign into the WebChat Admin Dashboard here.
  2. Create a WebChat Landing page : To create a new WebChat page, click on the Pages Tab at the top of the admin dashboard. Now, click on the ‘New Page Icon’. A popup window will appear. Give your new page a name by typing in the text box (the page name will be the name of your staff member). Enter the name without any spaces.  Now select the ‘Create Page’ button.

    Staff Directory Live Chat page name

  3. Edit your page:
    • Select your newly created page to edit. Choose your page from the drop down menu towards the top of the browser window.
    • Highlight and click on your preferred page to edit. Each page can have its own settings. You will start off by configuring the questions tab and the theme tab. See our user guide for more details.  
    • Below is an image of the page and settings that I created for Vanessa Smith:

      Live Chat staff directory page settings

  4. Now you will need to create a group :
    • Click the Group Tab at the top of the Admin Dashboard.
    • Select the option to  Create A Group and begin filling in your desired information. Click update when finished.
      • Name = Staff Member,
      • Email = Staff Member Email,
      • Routing Method = Please See our user guide for more information on routing methods
      • Greeting = This is the welcome message that your chat visitor will see when the conversation first connects
      • Invite Timeout = this is the amount of seconds that the staff member has before sending the chat visitor to an email form.

        Live Chat staff directory group settings

  5. Now create a user: A user is also known as an answering agent. When a chat request is sent it will be routed to the specified list of user/s.  
    • Click the Add New Users button.

    • Give your user a display name. This is the Staff Members name that will be displayed during the chat conversation.
    • Enter email address for your user. This is the email address of the Staff Member.
    • Enter the users Skype address. This is the Skype address of the Staff Member. If the Skype address is the same as the email address, then check the checkbox “Same as Email”.
    • Next add the group to the user. To Add, simply click and drag the group of your staff member from the available group section and place it in the assigned group. See Example below:

      Live Chat staff directory user settings

  6. Lastly we need to assign the Group to the Page:
    • Go back to the Page Tab at the top of the Admin Dashboard.
    • Now, click on the setting tab
      • Instruction Message: this is the instruction message that displays on the top of the Chat Request Form.
      • Group Mode: This section will allow you to display multiple groups on the “Chat Request Form” or to only have a single group option. To route the chat request to a single staff member, choose single group.
      • Assign Group: If you choose the single group mode, choose from the drop down menu the Staff members name. See image of setting below:
      • Save: Click the disk icon to save your page.

        Live Chat staff directory adding group to page 2

  7. Url : To access your created page you will use the following url: . 
    • Replace ‘companyname’ in the URL with how it appears in the admin’s signup email address. For ex: Domain will be the company’s name. Make sure no spaces are in the companyname. Hyphens are accepted.

    • Replace ‘StaffMemberName’ in the URL with the name of the page that was created inside the page tab of the admin dashboard (this will be the name of your staff member).

    • For example: Here is what the link looks like using the above settings.  
  8. Embed URL: Now it is time to embed your url into your staff directory.
    • Edit your staff directory and add the text “Live Chat”.
    • Amend a hyper link to that text and add the page url to it.  Example:  Live Chat  Notice the hyper is inside the text.
  9. Smaller Chat Window:
    1. To embed your link with a smaller chat window, add the following code to your staff directory and replace the url.
    2. To adjust the width and height of the chat window, make your adjustments inside this code. For Example: width=540, to make smaller adjust the number lower.
      1. , <a title=”Chat ” onclick=”‘’, ‘newwindow’, ‘width=540,height=455,toolbar=no,directories=no,status=no,menubar=no,scrollbars=yes,copyhistory=no,resizable=yes’); return false;” target=”_self”>Chat</a>
2017-03-22T16:06:31+00:00June 10th, 2016|Blogs, How To's|Comments Off on Staff Directory With Embedded Live Chat