Content - Card

A card is a message with a title and an optional subtitle that contains an image and action buttons. Refer the sample screenshot below:

Figure: Card content

Add a Card in a Node

1. In the Flow Editor, click the node where you want to add your card.
2. Choose where to put your card: On Enter, On Receive, or Transitions.
3. Click +.
4. Under Message, click the box.
   1. In the Pick Content dialog, under Search In, select Card.
   2. You can either:
      1. Select an existing card in the list.
         Note:

         This will bring you directly to step 5.
      2. Click the Create new Card button.
   3. A new window will be displayed where you can modify the following options:
      1. The Title box.
      2. The Subtitle box.
      3. The Image button.
   4. Click Submit.
5. Click Add Action (Alt+Enter).

Options

When adding a Card content, you can modify some options:

Video

There are two ways to add a video:

• Under Video, click the square with an up arrow. Then, you can choose which video you want to add there from your storage.
• Under Video, click the Or enter URL button at the bottom right of the square. A box will appear and you can type the URL of your video.

Title

This is the most important information regarding your card. It will be displayed in bold and just under the selected image.

Subtitle

The subtitle gives extra information (that couldn't be in the title) about the card.

Image

There are two ways to add an image:

• Under Image, click the square with an up arrow. Then, you can choose which image you want to add there from your storage.
• Under Image, click the Or enter URL button at the bottom right of the square. A box will appear and you can type the URL of your image.

Add an Action Button

An action button is a button that triggers an action.

1. When creating your card, there is a Add Action Button button that you can click. This will open a new dialog box.
   1. Under Title of the button, type the name you want to give to your button.
   2. Under Action, you can select either:
      1. Say something;
      2. Open URL;
      3. Postback.
   3. The last box is about entering a text or the ID of a content element that you want to show in the conversation.
2. Click Submit.

Options

When adding an action button, you can modify some options:

Title of the button

This title is what the user will see on the button. They will click the button and it will trigger one of the three possible actions.

Actions

• Say something: when the user clicks the button, it will answer with a text.
• Open URL: when the user clicks the button, they will be redirected to a website, opening a new window in their browser.
• Postback: when the user clicks the button, the desired data (typed in the payload box) will be sent back to the server. For example, your button could be titled Buy with idOfMyItem as a payload.