> ## Documentation Index
> Fetch the complete documentation index at: https://knowledge.komo.tech/llms.txt
> Use this file to discover all available pages before exploring further.

# Image Card

> Display a branded image, gif, or advertisement.

## What is it?

An Image card allows you to share an image or GIF on your Hub. This image can be linked to an external site or another card in your Hub, or simply exist as an image. The Image card is a great option for sponsored posts or advertisement!

## Watch it come to life

<iframe src="https://www.loom.com/embed/cbb99ef843cd4d73a42e9690de344db9" title="Loom video player" frameborder="0" className="w-full aspect-video rounded-xl" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" allowfullscreen />

## How do I build one?

* [Step 1: Add an Image card to your Hub](#step-1-add-an-image-card-to-your-hub)
* [Step 2: Add your Cover image](#step-2-add-your-cover-image)
* [Step 3: Add a Data capture (Optional)](#step-3-add-a-data-capture-optional)
* [Step 4: Publish your card](#step-4-publish-your-card)

<Card title="Want the design asset guideline?" icon="sparkles" href="https://docs.google.com/presentation/d/1Os299H5BbialJvEIcXF5la0Z6rElFu7_cbHA8MtefeY/edit" cta="Click here" />

### Step 1: Add an Image card to your Hub

<img src="https://mintcdn.com/komotechnologies/lDpX8fzjw-uBAUV9/images/image-card-step-1-add-an-step-1.gif?s=bdae3e854a1fe68d05870318677bd21c" alt="Image Card: step 1 — Step 1: Add an Image card to your Hub" width="2000" height="1100" data-path="images/image-card-step-1-add-an-step-1.gif" />

* Navigate to your **Engagement Hub**.
* Once there click **Add Content,** from here select **Media** and then **Image.**
* You will then see your new card has been added to your Hub.

### Step 2: Add your Cover image

<img src="https://mintcdn.com/komotechnologies/lDpX8fzjw-uBAUV9/images/image-card-step-2-add-your-step-2.webp?fit=max&auto=format&n=lDpX8fzjw-uBAUV9&q=85&s=e37b0d27cc9f0bf40f5533426a3f96f5" alt="Image Card: step 2 — Step 2: Add your Cover image" width="2864" height="1480" data-path="images/image-card-step-2-add-your-step-2.webp" />

* Clicking on the **Image** will open the editing module.
* **(1)** Here is where you'll add your **Cover** image.
* **(2)** You can add an **author** tag by displaying the brand or person who's responsible for the card content.
* **(3)** Add a **description** to the card.
* **(4)** Here you can add a **call-to-action** button below the card.

  <Note>
    This is only visible if you have a data capture attached. If you have this disabled, make sure you add a CTA in the cover image. <img src="https://mintcdn.com/komotechnologies/lDpX8fzjw-uBAUV9/images/image-card-step-2-add-your-option-a.webp?fit=max&auto=format&n=lDpX8fzjw-uBAUV9&q=85&s=699e5e6ed75aacd71b05d1208fbbcecf" alt="Image Card: option a — Step 2: Add your Cover image" width="2866" height="1478" data-path="images/image-card-step-2-add-your-option-a.webp" />

    * **(A)** Once you have enabled the button, click on the bar to alter the **colour and copy** of the call-to-action.
  </Note>
* **(5)** Here you have the option to direct users to an **external site or card** when they click on the image.

### Step 3: Add a Data capture *(Optional)*

Add a Data Capture to your Vote card if you want to collect user data.

<Card title="Ready to set up your competition?" icon="sparkles" href="/getting-started/hub-setup/data-capture/index" cta="Click here" />

### Step 4: Publish your card

<img src="https://mintcdn.com/komotechnologies/lDpX8fzjw-uBAUV9/images/image-card-step-4-publish-your-step-4.webp?fit=max&auto=format&n=lDpX8fzjw-uBAUV9&q=85&s=e07832c1591b3cf55891a2e16cf4f0af" alt="Image Card: step 4 — Step 4: Publish your card" width="2878" height="1590" data-path="images/image-card-step-4-publish-your-step-4.webp" />

**Once you've completed all of these steps, played around with your card and are happy with all the aspects of your card, it's time to get your card live!**

* **(1) Publish** your card manually and instantly for the world to see.
* **(2) Schedule** your card to be published and unpublished at set dates and times.
* **(3)** Click on **...** to **Preview** and interact with the card on the front end from a user's perspective before publishing it. See how to test your card [here](/getting-started/hub-setup/card-testing).

<Note>
  All competition entries will be recorded and will impact the card analytics.
</Note>

## Promotion

<Card title="Stuck on how to promote your activation?" color="#F1E52C" icon="sparkles" href="/getting-started/promotion/promoting-your-engagement-hub/index" cta="Click here!" />

## FAQ

**What type file formats can I upload in the Image card?**

You can upload PNG, JPEG and GIF formatted images.
