You are here:
Add Elements to a Flexcard
Build your card by dragging elements into a state on the canvas. Add data fields, display, and input elements to your Flexcard. Show data generated dynamically from the Flexcard’s data source, or add static information. Rearrange, clone, delete, and adjust the widths of your elements as needed. Style an element and configure its properties in the Flexcard designer.
- From the App Launcher, find and select Flexcards.
- Expand a Flexcard and select a version.
- If needed, deactivate the Flexcard for editing the Flexcard.
-
To add an element to a Flexcard:
- From the elements panel, drag an element from the Elements panel to the canvas.
- In the designer for a managed package, drag an element from the Build tab.
-
Fields: Display data fields generated from the Flexcard's data source. For example, display policy information for an account.
-
Display: Add elements that show information, execute actions, or send data. For example, for a customer service portal, include the priority of a case, a button to close a case, or a banner to navigate to your company website.
-
Inputs: Add elements where users enter or select information from the defined values that you provide. For example, your portal users can enter their phone number, or select a date for an appointment.
-
Select an element on the canvas, and then add or update its properties:
- To open the property panel, click
. - In the designer for a managed package, click the Properties tab.
In the properties panel, specify the element’s characteristics such as the name, the size, or show conditions - To open the property panel, click
- On the Style tab, specify the element’s look and feel, such as the alignment, the color, or apply a custom style.
- Flexcards Display Elements
Show relevant information to your users by adding display elements to Flexcards such as data fields, actions, states, data tables, and more. While we provide info bubbles for most element properties directly in the app, some elements are more complex to set up, such as custom Lightning web components. Review the considerations and requirements for those elements. - Flexcards Input Elements
Add input elements to Flexcards so that your users can provide data, which then updates the JSON data. You can also configure an element to run an action when a user interacts with the element.

