Optional card configurations

Edit online

Explore the optional configurations for cards. The configurations enhance card functionality and appearance.

Adding tags to the header of cards

Add a tag property to display a tag in the card header to enhance the card appearance.

The following cards show the Publish and Preview tags with assigned colors.
Figure 1. A table card with Preview tag
A table card that displays a Preview tag
Figure 2. A KPI card with Publish tag
A KPI card that displays a Publish tag
  1. From the navigation menu, click Card builder.
  2. On the My cards tab, click the card name for which you want to add a tag.
  3. Click the Edit source icon.
  4. Locate the devConfigurations properties and add the following code snippet to it.
       {
      "name": "header.previewTagText",
      "values": [
         "Under progress"
      ],
      "metaInformation": "widgetOption"
   },
   {
      "name": "header.previewTagDescription",
      "values": [
         "This card is under progress."
      ],
      "metaInformation": "widgetOption"
   },
   {
      "name": "header.previewTagType",
      "values": [
         "red" 
      ],
      "metaInformation": "widgetOption"
   }
    Where,
    header.previewTagText
    The text that is displayed in the tag.
    header.previewTagDescription
    A description of the tag. The description appears when a user hovers over the tag.
    header.previewTagType
    The color of the tag.
  5. Click Save.