Add to Card Carousel

Add cards to a carousel collection in Web Client

Written By Support Channel

Last updated 8 months ago

Overview of Add To Card Carousel

The Add to Card Carousel action enables you add a new Adaptive Card to a carousel in Web Client, allowing you to present multiple cards side by side in a scrollable format.

Purpose

Adds an Adaptive Card to the card carousel

Parameters

1 Web Chat Instance
1 Card Template
Card Data Values

Outputs

None

Understanding the Add To Card Carousel action

To use the Add To Card Carousel action, several settings must be configured. These settings determine who will receive the card, which card will be displayed, and how its content will be populated.

Parameters

Web Chat Instance - Select the Web Chat instance where the card will be sent

Card Template - Choose the Adaptive Card template to be used to display the card. See the Card Editor for information on card templates.

Card Data - Provide the data needed to populate dynamic elements of the card. These values map to the bindings defined in your chosen card template. For example:

  • Title: "Approval #1234"

  • Status: "Pending"

Outputs

None

Working with the Add To Card Carousel action

How it works

Cards are added to a โ€˜stagingโ€™ card carousel off-screen by calling the Add To Card Carousel action. At any point, the content of the staging carousel can be pushed to the chat client using the Show Card Carousel action. Having moved its card content to the chat client, the staging carousel is emptied and ready to accept new cards in response to further Add To Card Carousel actions.

Working with published card carousels

Once a card carousel has been shown using with the Show Card Carousel action, you are no longer able to add further cards to it. If you need to change the cards displayed by an existing carousel, either use the Update Card Carousel action to change the cards it displays, or build a new carousel with the additional cards required and publish this to the chat stream.

Note

Workflowโ€™s have a staging card carousel. Showing a carousel publishes its content to the chat stream. Published carousels may be updated, but canโ€™t receive additional cards.

Calling the Add To Card Carousel action after showing a carousel will add a card to the staging carousel off-screen, and not to a carousel published to the chat stream.

Card Templates

Each card in a carousel may use a distinct card template. This means that you can mix and match different templates inside the same carousel to fit the material you're presenting. For example, you could cards showing: a status update, a calendar event, and a task summary.

Create and manage Add To Card Carousel actions

Add an Add To Card Carousel action

Add the action

Use the following steps to add the action to a workflow.

Configure the action

Use the following steps to configure the action.

  1. Set values for the fields Web Chat Instance and Card Template.

  2. Set Card Data values for fields generated from the card template, if present. Required fields must have values entered.

  3. Click back in the main view to hide the slide-over.

Delete an Add To Card Carousel action

Use the following steps to remove the action from your workflow:

Take care when deleting an action to also remove any logic using its outputs: workflow steps may function incorrectly or break if they attempt to evaluate an output of a deleted action.