Configuring your business lines and queues for Contact Us

Business line and queue information, as well as the settings for how Contact Us displays, are set in the JavaScript file contactus.config.js. This file can be found at <drive>:\Program Files (x86)\Mitel\MiContact Center\WebSites\Ccmwa\Scripts.

If you intend to offer multiple instances of Contact Us on your corporate website with different business line and queue information, you will require multiple copies of contactus.config.js. Copies of contactus.config.js can be renamed and stored in different locations, but script references to Contact Us must be updated to renamed file in the script reference’s parameters. For more information, see "Adding Contact Us to your corporate website".

Business line or service group sections can be added or removed and the available media types for each of these sections can be modified. The media type layout is fluid so that if one media type icon is removed, the others flow together.

The following procedures describe how to:
  • Configure the header and footer
  • Hide the header or footer
  • Apply a light or dark icon theme
  • Use the horizontal Contact Us layout
  • Configure contactus.config.js with business lines and media types
  • Remove media types from a service group or business line in an instance of contactus.config.js
  • Configure logging and connection options
To configure the header and footer
  1. Open the instance of contactus.config.js in a text editor.
  2. Locate the field HeaderHTML.
  3. Replace field’s content with your header content.
  4. Locate the field FooterHTML.
  5. Replace the field’s content with your footer content.
  6. Save and close the text editor.
To hide the header or footer
  1. Open the instance of contactus.config.js in a text editor.
  2. If you want to hide the header, locate the line ShowHeader: true and set it to false.
  3. If you want to hide the footer, locate the line ShowFooter: true and set it to false.
  4. Save and close the text editor.
To use a light or dark icon theme
  1. Open the instance of contactus.config.js in a text editor.
  2. If you want a light icon theme, locate the line IconTheme and set it to Light.
  3. If you want a dark icon theme, locate the line IconTheme and set it to Dark.
  4. Save and close the text editor.
To use the horizontal Contact Us layout
  1. Open your instance of contactus.config.js in an editor.
  2. Set UseVerticalBusinessLinesFirst to true.
  3. Save and close the editor.
To configure contactus.config.js with business lines and media types
  1. Open the instance of contactus.config.js in a text editor.
  2. Replace the existing values in the service group/business line fields.

    See the following table for a description of each field.

    See the following figure for a labeled diagram of what fields correspond to which elements in Contact Us.

    Table 1. Business Line fields
    contactus.config.js fields Description
    BusinessLineName The name of the business line or service group
    HoursOfOperation The hours of operation for the contact center handing the queues for this business line or service group
    UnifiedQueueIdOrNameOrReporting The service group/business line’s Unified Queue Group GUID, Name, or Reporting Number
    EstimatedWaitTimeLabel The Estimated Wait Time label text that displays when a mouse hovers over
    ShowIconCaptions If True, Contact Us will display the caption configured in Caption. If False, it hides the caption
    MediaTypes The supported media types that display in the business line or service group
    Figure 1. Contact Us contactus.config.js fields


  3. Under MediaTypes, configure the MediaTypes fields to correspond to the queues for your own service groups or business lines.

    See the following table for a description of each field.

    See the following figure for a labeled diagram of what fields correspond to which elements in Contact Us.

    Table 2. MediaTypes fields
    Contact.Config.js fields Function
    Enabled
    Controls whether or not the media type can be interacted with
    • If set to True, the media type’s icon and text are clickable
    • If set to False, the icon is greyed out and cannot be interacted with
    OnMouseHoverMessage The text that displays when a mouse hovers over an icon
    CssClass
    The CSS class used for the media type. By default, these are:
    • Voice: lobMediaTypePhone
    • Chat: lobMediaTypeChat
    • Email: lobMediaTypeEmail
    • Callback: lobMediaTypeCallback
    • SMS: lobMediaTypeSms
    Caption The caption text. Used in conjunction with ShowIconCaptions.
    ContactDisplayInfo The text displaying the contact information for the queue, such as email address or phone number
    Icon
    The type of icon used for this media type. Supported icon values are:
    • Phone
    • Chat
    • Email
    • SMS
    • Callback
    QueueIdOrNameOrReporting

    The queue’s GUID

    This unique identifier enables Contact Us to identify this Contact Us queue with a queue on the media server

    For instructions on how to obtain a queue's GUID, see "Obtaining Queue GUIDs".
    ClickToContactInfo

    The queue’s dialable phone number, email address, chat queue external URL, or SMS number.

    Note:
    • Phone numbers and SMS numbers must be entered with no spaces or other characters
    • If you enter the external URL for CCMWa/chat instead of an external URL for a queue, then no chat Estimate Wait Time will display as no queue has been selected.
    Handler
    The type of media. The Handler can be:
    • Call
    • Chat
    • Email
    • SMS
    • Callback
    Note:

    It is not recommended to change or edit this field, unless you are adding or removing an entire media type.
    SupportedProtocols

    The protocols your business can support for the media type contact mechanism. Protocols can be added for voice queues. The following protocols are supported:

    Voice:
    • ‘tel’ – calls the number configured in ClickToContactInfo using the telephone application
    EwtPrefix

    It is not recommended to change or edit this field, unless you are adding or removing an entire media type.

    If the media type is voice, email, chat, or SMS, set EwtPrefix value to "ewt"

    If the media type is callback, set the EwtPrefix value to "ewt_wcb"
    OutboundWorkflowId
    • The GUID for OutboundWorkflow subroutine.
    • Contact Us can now be configured with a WebCallback subroutine at the queue level. Obtain the GUID for the subroutine and update the associated configuration file for Contact Us. This enables Contact Us to pass along the correct subroutine to be used to initiate a callback routing for the given queue.
    • For instructions on how to obtain a subroutine GUID, see "Obtaining Subroutine GUIDs".
  4. Save and close the text editor.
To add media types to a service group or business line in an instance of contactus.config.js:
  1. Open the instance of contactus.config.js in a text editor.
  2. If the media type is email, chat, or SMS, locate the service group or business line’s section in contactus.config.js and add the following under MediaType: 
    Enabled: true,
    OnMouseHoverMessage: "",
    CssClass: "",
    Caption: "",
    ContactDisplayInfo: "",
    Icon: "",
    QueueIdOrNameOrReporting: "",
    ClickToContactInfo: "",
    Handler: ""
    EwtPrefix: ""
    },
  3. If the media type is callback, locate the service group or business line’s section in the contactus.config.js and add the following under MediaType: 
    {
    Enabled: true,
    OnMouseHoverMessage: "",
    CssClass: "lobMediaTypeCallback",
    Caption: "Callback",
    ContactDisplayInfo: "Callback",
    Icon: "Callback",
    QueueIdOrNameOrReporting: "",
    ClickToContactInfo: "Callback",
    Handler: "Callback",
    EwtPrefix: "ewt_wcb",
    OutboundWorkflowId: ""
    },
  4. If the media type is voice, locate the service group or business line’s section in contactus.config.js and add the following under MediaType: 
    Enabled: true,
    OnMouseHoverMessage
    CssClass: " lobMediaTypePhone ",
    Caption: "",
    ContactDisplayInfo: "",
    Icon: "",
    QueueIdOrNameOrReporting: "",
    ClickToContactInfo: "",
    SupportedProtocols "tel",
    Handler: "Call"
    EwtPrefix: "ewt"
    },
  5. Configure the fields.
  6. Save and close the editor.
To remove media types from a service group or business line in an instance of contactus.config.js
  1. Open the instance of contactus.config.js in a text editor.
  2. To remove a media type, delete that media type’s lines from under MediaTypes,

    To delete chat, for example, you would delete the following lines:

    {
    Enabled: true,
    OnMouseHoverMessage: "Chat with Sports Support",
    CssClass: "lobMediaTypeChat",
    Caption: "Chat",
    ContactDisplayInfo: "",
    Icon: "Chat",
    QueueIdOrNameOrReporting: "d596e70f-526d-4c94-aa86-faa0e8bdb9db",
    ClickToContactInfo: "http://localhost/ccmwa/chat/d596e70f-526d-4c94-aa86-faa0e8bdb9db",
    SupportedProtocols: "",
    Handler: "Chat",
    EwtPrefix: "ewt"
    },
  3. Save and close the text editor.
To configure logging and connection options
  1. Open the instance of contactus.config.js in a text editor.
  2. After ClientSidelogging, type True if you want to enable a log for Contact Us to be available in the client’s browser.
  3. After ConnectionRetryLimit, set the number of times a desktop device can attempt to connect to Contact Us.
  4. After MobileDeviceConnectionRetryLimit, set the number of times a mobile device can attempt to connect to Contact Us.
  5. After ConnectionRetryIterationCount, set the number of times a device can attempt to connect before prompting the user that it is unable to connect and that a refresh will occur.
  6. Save and close the text editor.
Parent topic: Implementing Contact Us
↑