> ## 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.

# Click Banner Card

> Direct users to an external site or another card on your Hub

## What is it?

The Click Banner works by uploading a smaller image (1920 x 480) to the card that can then link users to external sites or to other cards within your Engagement Hub.

### Watch it come to life

<iframe src="https://www.loom.com/embed/e030207745a94782a0510bf71fc10d2c" 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 a Click Banner to your Hub.
* **Step 2:** Edit your card settings
* **Step 3:** Publish your card

### Step 1: Add a Click Banner card to your Hub

<img src="https://mintcdn.com/komotechnologies/fh79xGJR6fRUjmRd/images/click-banner-card-step-1-add-a-step-2.gif?s=0d5fcca9306450474b39eaa2e8fd341e" alt="Click Banner Card: step 2 — Step 1: Add a Click Banner card to your Hub" width="2000" height="1098" data-path="images/click-banner-card-step-1-add-a-step-2.gif" />

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

### Step 2: Edit your card settings

<img src="https://mintcdn.com/komotechnologies/fh79xGJR6fRUjmRd/images/click-banner-card-step-2-edit-your-step-2.webp?fit=max&auto=format&n=fh79xGJR6fRUjmRd&q=85&s=a54fb9011962f6e9d7824ef78df6e192" alt="Click Banner Card: step 2 — Step 2: Edit your card settings" width="2868" height="1486" data-path="images/click-banner-card-step-2-edit-your-step-2.webp" />

* Clicking on the **Click Banner** will open the editing module.
* **(1)** Here is where you'll upload your **image**.
* **(2)** You have the option to enable a **call-to-action** bar.
  <Note>
    This will only be visible if an external link has been attached.
  </Note>
* Here you can have the image link to an **external site** or **scroll** to another card.
  <Tip>
    You can upload a transparent image to use as a spacer or divider to sort the content on your Hub.
  </Tip>

### Step 3: Publish your card

<img src="https://mintcdn.com/komotechnologies/fh79xGJR6fRUjmRd/images/click-banner-card-step-3-publish-your-step-3.webp?fit=max&auto=format&n=fh79xGJR6fRUjmRd&q=85&s=187d95f48f1c3f07b8c8e9379f75fb97" alt="Click Banner Card: step 3 — Step 3: Publish your card" width="2876" height="1586" data-path="images/click-banner-card-step-3-publish-your-step-3.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>

<Card title="Card Design Guidelines" color="#F1E52C" icon="cards-blank" href="https://docs.google.com/presentation/d/16-DI5vUsddIj7XipHAr84YwK3wGH366dwJScyRKZ_HI/edit?usp=sharing" cta="Learn More" />

## FAQ

**Can I add an author tag and description to my Click Banner?**

Yes, you can do this by clicking on the **Options** button at the bottom of the card. However, we recommend not turning these options on and instead incorporating all the relevant information in the Click Banner design.

**Can I use them to link to an external site?**

Yes, click [here](#step-2-edit-your-card-settings) to find out how.

**What file formats can I upload?**

You can upload PNG, JPEG, GIFs for the Click Banner.