# Promo card

### Summary <a href="#promocardcomponent-summary" id="promocardcomponent-summary"></a>

The Promo card is a good way to highlight content and take users to that content. It consists of a title, image, date, summary text, and a link.

This article shows you how to add a Promo card component to a Manual list component.

Below is a promo card.

![](/files/1cRzE4eG9p6JcuUPo3Z7)

And this is what four promo cards in a row looks like.

<figure><img src="/files/jxxM8E0VuLTIm4OtaDyF" alt=""><figcaption></figcaption></figure>

### Step 1 - Add the Promo card <a href="#promocardcomponent-step1-addthepromocard" id="promocardcomponent-step1-addthepromocard"></a>

Within the Manual list component under List items, click on the dropdown and select Promo card as shown below.

<figure><img src="/files/gQyzqLAfxf3iELi4IWUc" alt=""><figcaption></figcaption></figure>

In the screenshot below you can see the Promo card fields, which are numbered and highlighted.

<figure><img src="/files/6GRremnPaWUZFh5ghCkI" alt=""><figcaption></figcaption></figure>

1. Title - Add the card title.
2. Subtitle - Add a subtitled if desired.
3. Image - Add an image to the card if desired.
4. Summary - Add summary text to the card.
5. Link - Type in the link for the page the card will link to.
6. Topics - Add a topic if desired. If you'd like to add more than one topic, click on Add another item.
7. Theme - Choose the light or dark theme.

### Tip <a href="#promocardcomponent-tip" id="promocardcomponent-tip"></a>

You can configure the number of Promo cards in one row by adjusting the “Column count” under the “Appearance“ tab as shown below.

<figure><img src="/files/O6ViSeKZDwcHWqnzzpP1" alt=""><figcaption></figcaption></figure>


---

# Agent Instructions: 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:

```
GET https://docs.civictheme.io/content-authoring/components/list-components-and-cards/cards-for-lists/promo-card.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
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.
