> ## Documentation Index
> Fetch the complete documentation index at: https://cometchat-22654f5b-docs-llms-scoped-indexes.mintlify.site/llms.txt
> Use this file to discover all available pages before exploring further.

# Card Message

> Card Message — CometChat documentation.

The `CardMessage` class is used to create a card message for CometChat. It extends the `InteractiveMessage` class from CometChat.

### Constructor

| Name | Type | Description |
| - | - | - |
| receiverId | string | The ID of the receiver |
| receiverType | string | The type of the receiver |
| text | string | The text to be displayed on the card |
| cardActions | ButtonElement | The actions to be performed when the card is interacted with |

### Class Usage

How to create an instance of the `CardMessage` class:

<Tabs>
  <Tab title="TypeScript">
    ```typescript theme={null}
    // Create instance of ButtonElement for card actions

    let cardAction = new ButtonElement(
      "1",
      new APIAction("https://example.com/api", "POST"),
      "Click Me"
    );

    // Create a new instance of CardMessage

    let cardMessage = new CardMessage(
      "receiverId",
      CometChat.RECEIVER_TYPE.USER,
      "This is a card",
      [cardAction]
    );
    ```
  </Tab>
</Tabs>

### Key Properties and Methods

#### Image Url

The `setImageUrl()` method allows to set the image URL for the card.

<Tabs>
  <Tab title="TypeScript">
    ```typescript theme={null}
    let cardMessage = new CardMessage(
      "receiverId",
      CometChat.RECEIVER_TYPE.USER,
      "This is a card",
      [cardAction]
    );

    cardMessage.setImageUrl("https://example.com/image.png");
    ```
  </Tab>
</Tabs>

### Example

Below is an example that showcases the creation and manipulation of an instance of `CardMessage`:

<Tabs>
  <Tab title="TypeScript">
    ```typescript theme={null}
    // Create an instance of APIAction

    let apiAction = new APIAction("https://example.com/api", "POST");

    // Create instance of ButtonElement for card actions

    let cardAction = new ButtonElement("1", apiAction, "Click Me");

    // Create a new instance of CardMessage

    let cardMessage = new CardMessage(
      "receiverId",
      CometChat.RECEIVER_TYPE.USER,
      "customType",
      "This is a card",
      [cardAction]
    );

    cardMessage.setImageUrl("https://example.com/image.png");
    ```
  </Tab>
</Tabs>

In this example, a new instance of CardMessage is created. The text, card actions and image URL are retrieved, updated, and retrieved again. Then a new CardMessage instance is made from a JSON object, and the text is retrieved and logged.


This documentation is built and hosted on [Mintlify](https://mintlify.com), a developer documentation platform.