Setting up Certinia Card Panels

There are two Certinia card panels:

  • The FDN Cards Panel component enables you to add a single component containing multiple highlight and KPI cards to an object's Certinia Lightning record page.
  • The FDN App Page Cards Panel component enables you to add a single component containing multiple KPI cards to any app page, such as workspaces.

You can clone and rename existing component configurations in the following component configuration builders:

  • Cards Panel Configuration Builder: For panel configurations to be used on object record pages.
  • App Page Cards Panel Config Builder: For panel configurations to be used on app pages.

The configurations that you create in these configuration builders are displayed in a list in the Lightning App Builder for the relevant component. See Setting up Card Panels in the Lightning App Builder.

You must have the Certinia Configuration Builders permission set assigned to you to use these configuration builders. You can also delete your own configurations.

Setting up Cards in the Cards Panel Configuration Builder

To set up a cards panel configuration in the Cards Panel Configuration Builder:

  1. From the App Launcher, select Cards Panel Configuration Builder.

    In the configuration builders, existing card panel configurations are displayed on the left and the Cards Panel configuration preview pane on the right.

  2. To create a configuration, click New. The New Configuration window opens.
  3. Enter a unique label for the panel. This label is displayed in the My Configurations list, and you can select this configuration when adding the component to the record page.

    When you click outside this field, the API Name field is populated.

  4. [Optional] Edit the API name. This must be a unique name.
    Note: The combined character limit of the Prefix and API Name fields is 40 characters.
  5. Click Save. The panel's configuration pane opens.
  6. Select an object for the metrics that you want to display on the cards.
  7. Click Add Card in the empty card. The Add Card window opens.
  8. Select the type of card to add. The relevant card configuration window opens.
  9. Set up the card. See the related topics for information on how to set up each card component.
    Note: You can set dynamic thresholds for Highlight cards that use number and currency fields. This compares the card's value against a percentage of a reference field's value, and then applies the relevant threshold color. This is not available for KPI cards in the panel, nor any standalone cards of any type.

    To use dynamic thresholds:

    1. From the Threshold Calculation Type options, select Percentage.
    2. From the Threshold Reference Field field, select the relevant field.
    3. From the Greater Than Threshold Percentage field or the Less Than Threshold Percentage field, enter a percentage value as a whole number.
    4. From the Greater Than Threshold Color field or the Less Than Threshold Color field, select a highlight color.

    The following calculation is used:

    Card Value > (Threshold Reference Field * Greater Than Threshold Percentage) = Greater Than Threshold Color

    If the field selected from Card Value or Threshold Reference Field does not have a value, the card remains white, even if you set threshold colors.

  10. To add more cards, either:
    • Clicking Add Card in the empty card.
    • Click between the cards.
  11. [Optional] To reorder cards, drag a card to a new location in the panel.
  12. [Optional] To edit a card, hover over the card and click Edit, or double-click the card.
  13. [Optional] To delete a card, hover over the card and click Delete.
  14. Click Save when you have completed the configuration of your panel.

Setting up Cards in the App Page Cards Panel Config Builder

To set up a cards panel configuration in the App Page Cards Panel Configuration Builder:

  1. From the App Launcher, select App Page Cards Panel Config Builder.

    In the configuration builders, existing card panel configurations are displayed on the left and the Cards Panel configuration preview pane on the right.

  2. To create a configuration, click New. The New Configuration window opens.
  3. Enter a unique label for the panel. This label is displayed in the My Configurations list, and you can select this configuration when adding the component to the record page.

    When you click outside this field, the API Name field is populated.

  4. [Optional] Edit the API name. This must be a unique name.
    Note: The combined character limit of the Prefix and API Name fields is 40 characters.
  5. Click Save. The panel's configuration pane opens.
  6. Click Add Card in the empty card. The Add Card window opens.
  7. Select an object and a list view for the metrics that you want to display on the card.
  8. Click Save.
  9. Set up the card:
    • [Optional] Change the object or list view. If you change the object, you also have to change the list view.
    • [Optional] Enter a title for the card. Leave this blank to use the name of the list view.
    • [Optional] ] Select the field name used to calculate the KPI. If blank, the total number of records in the selected list view is used. Only fields on your selected object are available for selection.
    • [Optional] Enter a label for the KPI. If blank, the field name is used. If the field name is blank:
      • On a record page, the related list name is used.
      • On an app page, the field name is used.
    • Enter a description for the card. We recommend that you add a description.
    • Select the calculation type for the field name. If you have not selected a field name, the default calculation type is Count.
    • [Optional] Select a default color for the card when the thresholds are not applied, or when the card's value is within the thresholds.
    • [Optional] Enter a value between 0 and 100 for the higher threshold. Card values higher than this are highlighted with the color defined in the Greater Than Threshold Color field.
    • [Optional] Select a color for the card when its value is higher than the value in the Greater Than Threshold Value field.
    • [Optional] Enter a value between 0 and 100 for the lower threshold. Card values lower than this are highlighted with the color defined in the Less Than Threshold Color field.
    • [Optional] Select a color for the card when its value is lower than the value in the Less Than Threshold Value field.
  10. Click Save.
  11. To add more cards, either:
    • Clicking Add Card in the empty card.
    • Click between the cards.
  12. [Optional] To reorder cards, drag a card to a new location in the panel.
  13. [Optional] To edit a card, hover over the card and click Edit, or double-click the card.
  14. [Optional] To delete a card, hover over the card and click Delete.
  15. Click Save when you have completed the configuration of your panel.

Keyboard Controls

You can use the following keyboard controls in the configuration builders. When you are within a New or Edit window, the controls are limited to that window until you use Esc or commit a button action by pressing Enter when the button is selected.

Keyboard Controls for Component Builders

Shortcut

Usage
Tab Moves to the New button, down the existing panel configurations, and then through the buttons, fields, and the editor in any selected configuration.
Shift-tab Moves in the reverse order to Tab.
Enter

Opens the selected panel configuration.

Opens a new card.

Commits actions on buttons and fields in the card panel and edit windows.
Space

Enables you to add a card within the editor.

Enables a selected card to be reordered.

Commits actions on selected buttons and fields in the card panel and edit windows.
Up arrow

Selects the card or Add Card button on the row above the current card or Add Card button.

When reordering cards, moves the card to the row above. The replaced card moves to the right. Replaced cards that are at the end of a row move to the start of the row below.
Down arrow

Selects the card or Add Card button on the row below the current card or Add Card button.

When reordering cards, moves the card to the row below. The replaced card moves to the left. Replaced cards that are at the start of a row move to the end of the row above.
Left arrow

Selects the card or Add Card button to the left of the current card. If at the start of a row, selects the card at the end of the row above.

When reordering cards, moves the card to the left. The replaced card moves to the right. Replaced cards that are at the end of a row move to the start of the row below.

Right arrow

Selects the card or Add Card button to the left of the current card. If at the end of a row, selects the Add Card button at the start of the row below.

When reordering cards, moves the card to the right. The replaced card moves to the left. Replaced cards that are at the start of a row move to the end of the row above.
Esc

Escapes out of an edit window without saving changes.

Cancels the card reordering action.

Setting up Card Panels in the Lightning App Builder

To set up a panel in the Lightning App Builder for your users:

  1. In the Lightning App Builder, Custom - Managed list, drag either the FDN Cards Panel on to your record page, or the FDN App Page Cards Panel on to your app page.
  2. Depending on the panel you are using, in the Cards Panel Configuration or App Page Cards Panel Configuration field, select a configuration file.
  3. [Optional] Select the Hide Card Icon checkbox if you want to hide the icon in all cards.
  4. [Optional] Select the Show Cards Panel Title checkbox if you want a title to be displayed for the panel.
  5. [Optional] Enter a title for the panel in the Cards Panel Title field. If you leave this blank, the title of your selected configuration is displayed.

    The panel title is only displayed if you select the Show Cards Panel Title checkbox.

  6. Click Save and exit the Lightning App Builder.