Skip to main content

Creating a composite tab


3 Tasks

5 mins

Visible to: All users
Advanced Pega Customer Service 8.6 English
This content is now archived and is no longer updated. Progress is not calculated. Pega Cloud instances are disabled, and badges are no longer awarded. Click here to continue your progress in the latest version.


As a customer service app administrator, you must create a new tab to display the transaction history and statement for a contact in a separate tab.

Use the following credentials to log in to the exercise system:


User name


CS Administrator



Customer Service Representative



Your assignment consists of the following tasks:

Task 1: Create a composite tab called Contact

In Settings > Interactions > Customer composite, configure a new composite tab, name it as Contact and make this tab available in all customer interactions.

Task 2: Choose the content by selecting sections for the Contact tab

Add the sections to display the transaction history and statement by contact to the Contact tab.

Task 3: Confirm your work

In the Interaction Portal, start an interaction with John Brown, and verify that the new Contact tab is displayed.

Challenge Walkthrough

Detailed Tasks

1 Create a composite tab called Contact

  1. Log in to the exercise system as a Customer Service Application Administrator with User name CSAppAdmin using Password password123!.
  2. In the header of App Studio, click Settings > Interactions > Customer composite.
  3. Double-click any of the unconfigured composite tab to open the Edit tab dialog box.
    Note: For the moment, the system supports only 10 composite tabs.
Customer composite
  1. In the Edit tab dialog box, enter the following information:
    1. Name: Contact
    2. Description: Contact related widgets to be added here.
    3. Visibility: Always visible
  2. Click Submit.
    Edit composite tab
  3. Click Save.

2 Choose the content by selecting sections for the Contact tab

  1. Click Preview application to launch the Interaction Portal.
  2. In the Interaction Portal, click New > Configure customer composites to add sections to the Contact tab.
  3. Click the Contact tab.
  4. In the upper-right corner, click Design mode to add the content selecting sections in the Contact tab.
    Design mode
  5. On Contact tab, hover over the Workarea and then click the Edit icon to add sections to the tab.
    Note: The default template format of all the composite tabs is the composite with primary and widgets template. You can change the template by clicking the Change option.
  1. Click the Add icon to add the sections to display transaction history and statement by contact in the Primary view.
    Composite section widgets holder pane
  2. In the Sections section, click Display transactions and Display statements by contact to add them to the view.
    Sections for composite tab
  3. Close the composite section widgets holder pane.
    Sections in Primary view
  4. Click Design mode to freeze the data in the Contact tab.

3 Confirm your work

  1. Log in to the Customer Service Interaction portal as a Customer service representative with User name cacsr using Password rules.
  2. In the Interaction Portal, click New > Demo Screen Pops > Demo Pop - BROWN to begin an interaction with John Brown.
    Interaction with John
  3. Click Accept to accept the incoming call.
  4. Verify that the Contact tab you added is displayed.
    Contact tab in Interaction portal

Available in the following mission:

We'd prefer it if you saw us at our best.

Pega Academy has detected you are using a browser which may prevent you from experiencing the site as intended. To improve your experience, please update your browser.

Close Deprecation Notice