How to configure Card Layout

Go to "Layout" section of card properties at the right sidebar. Select Layout and click on link "create" ("edit", if card already has layout configured) to open Card Layout dialog popup.

Basic Configuration

Layout Body

Select layout body "None" in case you do not want to show sidebar (or modal popup) with card details when card is clicked.

Select Layout body "Form" if you need some specific form to be shown. Choose form and specify parameter(s) if necessary. For example:

Select Layout Body "Visualforce Page" to show some existing page from current organization. Choose a page in the proper field and set parameters, if needed.

Set Layout Body "Lightning Component" to embed some component. Select component and set parameters, if necessary:

Select Layout Body "Url" to embed some other page. Fill in proper field with some external URL and specify parameters, if necessary.

Only URLs to secure sites are allowed. If specify non-secure URL the site will be blocked by system.

Select Layout Body "SObject" to show current object standard details. You need to set Record ID (e.g., select {Case.Id} in the merge field picker to specify ID of record represented by current card).

Select Layout Body "Standard" to show multiple tabs in layout. Configure them on the "Tabs configuration" subtab that will appear:

Tabs Configuration

Open "Tabs Configuration" subtab. "SObject" tab is preset to show current object standard details.

Click "Add tab" button to open config dialog popup. Enter label and title in proper field, select icon using "Icon Library". Configure "Conditions", CSS Styles for tab in generic (inactive) and active states if necessary.

Select tab layout type in "Layout" field. Tab layouts are the same as described above, except the "Standard" one.

"Standard" layout type allows user to configure custom set of fields to display. Add fields under each other by adding rows to layout, set labels and values, rearrange rows, if necessary.

Card Layout Positions

Select layout position in the proper picklist:

Position "Right" will cause layout be shown as right sidebar:

Position "Left" will cause layout be shown as left sidebar:

Position "Modal" will cause layout be shown as modal popup:

Other Settings

In case if you hid header or footer, you don't need to configure them as described below.

Header Configuration

Go to "Header Configuration" tab to open "Title Settings".

Fill in "Text" field (static text, merge fields or formulas) and configure CSS Styles.

Footer Configuration

Open "Footer Configuration" tab and click "Add Button" to configure buttons, if needed.

Click "Save" to apply changes in card layout configuration and save dashboard.