Adding an Agents In/Out Widget

The following describes how to add a widget to a configuration that will allow individuals to log a specific Agent (normally themselves) in or out, as well as update that Agent's current state, alter their target number (if hot-desking is enabled), and more.

Implementation

1. Access the list of configurations for the intended Customer.
   How do I view a list of configurations for a specific Customer?

   1. Access the resources page for the intended Customer.

      How do I access resources for a specific Customer?

      1. Access the details page for the intended Customer.

         How do I access the details of a specific Customer?

         1. Type the Customer’s name into the search field at the top of any page.
         2. Click the intended Customer in the search results. This opens the Customer Details page.

      2. Select the Customer Resources tab.

   2. Click the CC4Web Configurations hyperlink.

2. Launch the intended configuration.
   How do I launch an individual configuration via the portal?

   When viewing the list of available configurations:

   1. If you don't want the configuration to appear in a new window, un-tick the first check box.
   2. Use the first drop-down to select the name of an Agent to simulate when you launch the configuration.
   3. Locate the configuration you want to access, and click its Launch button.

   Always remember to save any intended changes before exiting this mode.

3. Click Enter Design Mode.
4. Click Whole Config Properties. This will open the Properties page for the configuration. On the left-hand side of this page you will see a hierarchy of all current widgets.
5. Click the Add Another Widget option for where you'd like the widget to appear, which can be either the main window or a tab strip.

   You can add a new tab strip here if needed, as explained in Adding a Tab Strip.

6. On the right-hand side of the page, locate the Agents Log In/Out widget.

   The widgets listed here are sorted according to the type of licence required to operate them.

7. Click Add This Widget. The page will update, and the new widget will be selected, presenting you with its General tab.

8. Type a suitable Widget Title.

9. Use the Scope list to choose which Agent is affected by this widget. This is set to the logged-in Agent by default.
10. Use the Hotdesking options to control whether the widget can be used to specify a Target Number for the affected Agent.
    Hotdesking options...

    Option	Description
    Option: HOTDESK	Allows the hotdesking function for this widget. By default, this will present the configuration user with a text field in which to type the number that will route calls to them while logged into this configuration.
    Hotdesk Target List	If the Customer has any suitable hotdesk lists set up, you can choose one of them here. This will allow the configuration user to choose a target number in the list using a drop-down, instead of requiring them to type it manually.
    Option: HOTDESK_ALLOW_MANUAL	If a Hotdesk Target List has been selected, enabling this option will provide an optional text field that lets the configuration user type an alternate number in case the one they need is not in the list.
    Option: HOTDESK_TEXT_SEARCH	If a Hotdesk Target List has been selected, enabling this option will require the configuration user to type the name of an item in the list, rather than using a drop-down. The Agent's number will be set to the first item in the list that exactly matches what is typed; if no exact match is found, no number will be set, unless HOTDESK_ALLOW_MANUAL is enabled and the user has typed a valid number in the field provided.
    Option: HOTDESK_REQUIRED	If hotdesking is enabled together with this option, the user must specify a valid number for their session before they log in.

11. Use the Breaks options to determine whether and how the widget may be used to mark the affected Agent as either busy or on a break.
    Breaks options...

    Option	Description
    Option: BUSY_OPTIONS	Provides a drop-down containing a list of valid break and busy states for the Agent.
    Option: BUSY_USER_SPECIFIED	If both this and BUSY_OPTIONS are enabled, the user will be able to specify a custom busy state not in the list provided. To do this, they will need to select the (user specified text) option from the list, then use the text box provided to enter a short description of what they are doing.

12. Use the Wrap options to include visual functionality during the Agent's wrap and break times.
    Wrap options...

    Option	Description
    Option: WRAP_TIMER	If enabled, a timer will show how much of the Agent's allotted wrap time is currently remaining. If the Agent is on a break with a pre-defined duration, this timer will also show how long they have left on that break.
    Option: BREAK_TIMER	If enabled, any time the Agent is on a break with no pre-defined duration, a timer will show how long they have been on that break.
    Option: WRAP_RESTART	If enabled, a button will let the Agent reset their current wrap time to its initial limit.
    Option: WRAP_EXTEND	If enabled, a button will let the Agent extend their current wrap time by its normal maximum, e.g. if their permitted wrap time is 20 seconds, pressing the button will add 20 seconds to the current time remaining.
    Option: READY_BUTTON	If enabled, a button will let the Agent immediately end their current wrap time or break/busy period, marking them as waiting for a new call.

13. If the Agent has settings applied that will cause them to be logged out automatically at a certain time, you can use the Auto Log-out options here to add indicators and controls for monitoring this to the configuration.
    Auto Log-out options...

    Option	Description
    Option: DAILY_LOGOUT_TIME	Displays the time at which the Agent will be automatically logged out.
    Option: DAILY_LOGOUT_COUNTDOWN	Displays how many minutes remain before the Agent will be automatically logged out.
    Warning/Notification Duration	Determines how far in advance of the automatic log-out that the countdown and extension button—if enabled—will appear. This defaults to one hour ahead of time.
    Option: DAILY_LOGOUT_EXTEND	If enabled, this provides the Agent with a button they can use to delay their automatic log-out time by a period equal to the Warning/Notification Duration specified above. Since the duration is then exceeded, the button (and the countdown, if enabled) will disappear until later.

14. Use the Other options to configure miscellaneous options relating to the widget.
    Other options...

    Option	Description
    Option: CONTINGENCY	If enabled, the configuration user will be given the option of specifying a contingency phone number. If this is done, calls to the affected Agent will be routed to the specified number instead of their VoIP phone.
    Option: SHOW_WEB_SESSION_ID	If enabled, the widget will display the unique ID allocated to the configuration user's active session, for troubleshooting and auditing purposes.
    Option: QUERY_API	If enabled, the Agent's state will be accessible to the CC4Web JavaScript API.
    Option: NO_LINEBREAKS_IN_CALLSTATE

15. Use the Cost Centres options to control whether the configuration user can apply a specific cost centre to their session.
    Cost Centres options...

    Option	Description
    Option: ALLOW_COST_CENTRE	Adds a drop-down list to the widget, allowing the configuration user to specify a cost centre for the duration of their session, overriding any normally used for calls.
    Option: REQUIRE_COST_CENTRE	If this is enabled together with ALLOW_COST_CENTRE, the configuration user be unable to log in using this widget unless they pick a cost centre from the list provided.

16. Select the Break Types tab.
17. Use the check boxes in this tab to choose which break/busy states to allow for the Agent during the session.

18. Select the Styles and Layout tab.
19. Use the options provided to fine-tune the appearance of the widget.
    Styles and Layout...

    Header

    Option	Description
    Option: NO_HEADER	Whether the widget’s header should be hidden.

    Font Size and Colours

    Option	Description
    Zoom / Magnification Level	Use the drop-down to select a UI scale for this widget, from 10% (x0.1) to 1000% (x10). This defaults to 100% for all new widgets.
    Highlight (Larger) Font Size and Colour	Use the two drop-downs to select an alternative font size and colour for certain text in the widget, including its heading. The default size is 16, and the default colour is black.

    Widget Background and Borders

    Option	Description
    Background Colour	Use the drop-down to select a background colour of the widget. The default is white.
    Border Colour	Use the drop-down to select a border colour for the widget. The default is black.

    Auto-sizing (to fill window space)

    Option	Description
    Auto-size options	Use the drop-downs to select whether the widget should adjust in response to the browser window being re-sized. This is done individually for horizontal and vertical changes.

    Option: Fill Tab

    If the widget has been placed inside a tab, enabling this option will cause it to occupy the maximum available space in that tab.

20. Click Save Changes to confirm creation of the widget.
21. Repeat this process until you have all the widgets you need.
22. Click Return to Cxp Agent Experience.

    You should ensure each new widget is appropriately sized, positioned, and styled to fit in with the rest of the configuration. This can be done after adding each new widget, if you prefer.

23. When you've finished making changes to the configuration, click Exit Design Mode. It is now safe to close the current window or tab and return to the Admin portal.