Page

Pops a page in the agent application to assist an agent in their interaction. The popped page can display an image, text styled with basic HTML capabilities, or fields for the agent to enter information. You can use multiple Page actions in your script and include a Next button, allowing the agent to manually move along a sequence of pages.

Common uses of Page are displaying sets of instructions, steps of a script for the agent to speak, and so forth. Double-click the action to launch the configuration editor.

Use in conjunction with Onpageopen and Pageclose. To preview a page, use the OnPreview action.

Supported Script Types

The icon for a Generic script type - a rectangle with < and > symbols inside it. The icon for the Email script type - a large @ symbol in a diamond. The icon for the Chat script type - a chat bubble with an ellipsis inside (...), in a diamond shape. The icon for the Phone script type - an old-style phone handset with curved lines indicating sound coming out of it. The icon for the Voicemail script type - a symbol that looks like a cassette tape - two circles sitting on a horizontal line. The icon for the Work Item script type-a piece of paper with one corner folded down and a bullet list on it. The icon for the SMS script type - a smart phone with a chat bubble coming out of it. The icon for the Digital script type - a computer monitor with a smartphone next to it.
Generic Email Chat Phone Voicemail Work Item SMS Digital

Properties

Property Details
Title

The title of the HTML page that pops in the agent application.
RawXML

Reserved. Used to store the Page configuration. Not user editable.
ShowNext

True/False. When True, inserts the Next button on the HTML page.
ShowBack

True/False. When True, inserts the Back button on the HTML page.
StyleSheet

Insert a link to an external stylesheet. For example, <link REL="stylesheet" type="text/css" href="style.css">
BranchKey

Reserved. Used by the Page Property editor. Not user editable.
BranchOptions

Reserved. Used by the Page Property editor. Not user editable.

Branches

Branch Details

Default

Path taken unless the script meets a condition that requires it to take one of the other branches. It is also taken if the action's other branches are not defined.
OnNext Path taken when the user clicks the "Next" button.
Custom Cases Paths created and taken when connecting to secondary actions using Variable Branch Conditions. Click the ellipsis to open the ConnectView Collection Editor to customize these branches.

Configure Page Actions

  1. Add a Page action to your desired location in your script.
  2. Double-click the action.
  3. Add your desired components. Components are the elements displayed on the page that pops up, such as a text field or table. This editor displays an estimated preview of what the agent will see. The CXone agent applications support multiple browsers, which may have small differences in how they display these components. Perform adequate testing with a test interaction to ensure that you are content with the functionality and visual display.
    ComponentDescription
    Bullet ListA standard bullet list. To create the list, enter one item per line in the Items string editor.
    CheckBoxA single checkbox. You can determine whether or not the default status is checked or not. You can also enter a variable value in the Value property, which can be passed along the script. The Label is the text that displays beside the checkbox.
    CheckBox ListMultiple checkboxes that share the same group name. You can add multiple checkbox items in the CheckBoxes collection editor. Add each checkbox that you want to display and configure its Value and Label. You can create a variable branch for each checkbox in the list.
    Dropdown ListA drop-down menu. You can create drop-down options by opening the Choices collection editor. You can also populate the drop-down dynamically with values from an array. In the DynamicChoices string editor, enter values separated by the pipe symbol (|). You can create a variable branch for each drop-down item in the list.
    HyperlinkA standard web URL. Enter the URL, determine what Text will display as the hyperlink, and whether or not you want the Target to open in a new window.
    ImageAn image. You must use an image that can be referenced as a URL.
    Imbedded Frame (Script)Inserts an iframe into the popped page that runs a script. You can determine the dimensions of the iframe in the properties. You can set a Height or Width as an amount of pixels, or a percentage of the default Page frame.
    Imbedded Frame (URL)Inserts an iframe into the popped page that displays a webpage. Insert your desired URL and configure the iframe dimensions. You can set a Height or Width as an amount of pixels, or a percentage of the default Page frame.
    List BoxA list of options that display in a single box. You can populate the choices dynamically from an array in the DynamicChoices property, or enter static choices in the Choices editor. By default, only a single selection is allowed; set AllowMultiSelect to True to allow multiple selections. You can create a variable branch for each drop-down item in the list.
    ParagraphA basic paragraph of text. 
    Radio Button ListA list of radio buttons that share the same group name. You can add multiple buttons in the Buttons collection editor. Add each button that you want to display and configure its Value and Label. You can populate the list of buttons dynamically from an array in the DynamicButtons property. Separate each button in the string editor by a pipe symbol (|). You can create a variable branch for each drop-down item in the list.
    Table (dynamic)A basic table generated dynamically with variable values. You can dynamically populate columns of the table through a string of variables; each variable becomes an individual column with the variable as the column header. Each column contains a header and a single row below.
    Table (fixed)A basic table with a fixed amount of rows in a single column. You can enter however many rows you want and determine if you want the row to display as a header or not.
    Text Input AreaAllows the agent to enter text into the popped page. You can create a table of Rows and Columns for the agent to enter text.
    Text Input FieldA single field for the agent to enter text.
    Variables TableContains a table of all variables from this Page, or that have been passed along prior Pages, or global variables. Studio also provides default system variables. You can choose to make this variables table visible or invisible to the agent.
  4. Configure the component's properties.
  5. If you added a Text Input Area or Text Input Field, add any validators.

    Validators allow a scripter to restrict agent input to only data that meets specific formatting rules. For example, credit card numbers, dates, and email addresses all require a very specific format to be valid. This functionality provides a built-in Validator for a variety of commonly used formats. In addition, an input control may also have restrictions such as being a required field or having a min or max length. These types of validation rules may also be defined for any of these input fields.

    Validator Type

    		Purpose

    Validation Value Required

    RequiredMin

    		Specifies that a value must be entered in this field.

    True/False

    MinLengthField entered may not contain less than the number of characters specified in this value.Integer
    MaxLengthField entered may not contain more than the number of characters specified in this value.Integer
    RangeLengthField entered must contain at least X characters to Y characters. Value must be in the form “X-Y” where X and Y are integers.X-Y

    Min

    		Field entered must contain a number that is greater than or equal to this value.

    Integer

    Max

    		Field entered must contain a number that is less than or equal to this value.

    Integer

    RangeField entered must contain a number between X and Y, including X and Y. For example, if the range is 5-10 then the value entered must be greater than or equal to 5 and less than or equal to 10.X-Y
    EmailField entered must be in the format of an email. None

    URL

    		Field entered must be in the format of URL.

    None

    Date

    		Field entered must be in the format of a valid date. Studio can validate both U.S. and international date formats such as mm/dd/yyyy and yyyy/mm/dd. However, Studio verifies only the format, not the content. For example, 2/30/2022 is not a valid date but it is in a valid format. It will pass validation.

    None

    NumberField entered must be in the format of a decimal number.None
    DigitsField entered must contain digits only.None

    CreditCard

    Field entered must be in the format of a valid credit card number. The algorithm used cannot verify the validity of the number; it is an integrity check only.

    		None

    RegularExpression

    Field entered must match the regular expression defined in this value.

    		None
  6. If you want to remove a component, highlight it in the properties list and click . You can also move the component with the up and down arrows.
  7. Click Ok.

Tips & Tricks

  • Agent scripting often cuts down on training, improves contact handling, and facilitates more control in the way agents handle contacts.
  • The system can be configured to display screens and popups so that agents can be directed to specific steps while they are handling the contact.
  • The agent is transitioned through a series of pages depending on how the contact responds to certain questions. Page actions call the appropriate pages.
  • Any variables created or changed by the Page action will lose their values when any event, such as Onrelease, Onsignal, or other similar event, runs in the script. If data needs to be preserved for use after the call ends, an API call or DB insert should be used via iframe before the Page action ends.
  • Be sure to use a Pageclose action to conclude a sequence of Page actions. Not closing out a Page may result in "stuck" contacts as an agent may be able to click Next within the popped page even after the interaction is finished.

Similar Solutions

You can use Runapp to pop a custom form. Note that Runapp submits information through the Ondata branch, therefore Page may be more convenient when creating a sequence of items that may follow different branches.