> For the complete documentation index, see [llms.txt](https://docs.3dolphins.ai/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.3dolphins.ai/5.3.0-id/marketing/template/request-template/marketing-template/carousel-message/card.md).

# Card

Di dalam carousel, Anda dapat menambahkan lebih dari satu card yang berisi promosi. Setiap card dapat memuat gambar, judul, deskripsi, dan tombol aksi yang dapat menarik perhatian pelanggan karena mereka dapat menggulir (scroll) antar card untuk melihat berbagai promosi atau informasi sekaligus. Selain itu, carousel juga mendukung penggunaan link atau tombol call-to-action pada tiap card, sehingga mempermudah pengguna untuk langsung berinteraksi dengan promosi yang ditampilkan.

{% hint style="info" %}
Jumlah maksimal card yang dapat Anda buat adalah 10 card
{% endhint %}

<figure><img src="/files/ku1hyYNdJCUMjUr9YMKj" alt=""><figcaption><p>Card Template</p></figcaption></figure>

### Card Header

Pada bagian header card berfungsi untuk menampilkan judul atau informasi utama dari promosi. Anda dapat menggunakan header untuk menarik perhatian pengguna sejak pandangan pertama, sehingga mereka langsung tahu inti dari card yang ditampilkan.

{% hint style="info" %}
Anda dapat mengunggah media sebagai header dengan format JPG atau PNG (maksimal 5 MB) atau video dengan format MP4 (maksimal 16 MB)
{% endhint %}

Untuk mengupload media, Anda dapat mengklik **'+Upload Image'** atau **'+Upload Video'** pada bagian komponen **Card Media Header.** Ketika media berhasil diupload, Anda dapat melihat seperti yang ditunjukkan gambar berikut.&#x20;

<figure><img src="/files/cEMmMj33oSH6OLBbKsJY" alt=""><figcaption><p>Card - Header</p></figcaption></figure>

### Card Body Message

Bagian tengah card ini digunakan untuk menampilkan isi utama, seperti deskripsi promosi, detail produk, atau informasi penting lainnya. Anda dapat menambahkan pesan yang jelas dan menarik agar pengguna memahami apa yang ditawarkan dan terdorong untuk berinteraksi.

<figure><img src="/files/56xBamaqb1hY0ORcLrN1" alt=""><figcaption><p>Card - Body Message</p></figcaption></figure>

### Card Button

Bagian ini adalah tombol aksi pada card yang memungkinkan pengguna melakukan interaksi, seperti membeli produk, melihat detail, atau menuju halaman tertentu. Anda dapat menempatkan tombol dengan jelas agar mudah diakses dan sesuai dengan informasi yang disampaikan di header dan body.

{% hint style="info" %}
Maksimal button yang dapat Anda gunakan adalah 2 button.&#x20;
{% endhint %}

<figure><img src="/files/dLPcAIK3OGGhhuTXqlHq" alt=""><figcaption><p>Card - Button</p></figcaption></figure>

Untuk menambahkan card, Anda dapat mengklik tombol **'+New Card'** yang berada dibawah komponen card seperti yang ditunjukkan gambar berikut.

<figure><img src="/files/6xcEaEGq2qHK9ZYu58Wa" alt=""><figcaption><p>New Card</p></figcaption></figure>


---

# Agent Instructions
This documentation is published with GitBook. GitBook is the documentation platform designed so that both humans and AI agents can read, navigate, and reason over technical content effectively. Learn more at gitbook.com.

## Querying This Documentation
If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter, and the optional `goal` query parameter:

```
GET https://docs.3dolphins.ai/5.3.0-id/marketing/template/request-template/marketing-template/carousel-message/card.md?ask=<question>&goal=<endgoal>
```

`ask` is the immediate question: it should be specific, self-contained, and written in natural language.
`goal` is optional and describes the broader end goal you are ultimately trying to accomplish on behalf of the user. GitBook uses it to tailor the answer towards what is most useful for that goal.

The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.