---
title: "Add a Promo component"
slug: "add-a-promo-component"
abstract: "Highlight important content."
---
# Add a Promo component

> [!note]
> Use the Experience Editor for the steps described in this topic.

You can use the Promo component to highlight important content on your page, for example, to promote videos of your products or an upcoming event, or to point to the latest jobs on the careers page.

By default, the Promo data source items contain a text field, an image, and a link. The Promo component can have component variants.

To add a Promo component:

1. Open the toolbox.
2. From the **Page Content** section, drag and drop the **Promo** component on the placeholder that you want to add the Promo component to.
3. In the **Select the Associated Content** dialog box, select the promo that you want and click **OK**. Alternatively, click **Create** to create a new Promo component.
4. To select a component variant, in the floating toolbar, in the **Variant** list, select the variant you want.

    ![The floating toolbar for the Promo component.](https://doc.sitecore.com/api/markdown-image/xp/en/users/sxa/105/sitecore-experience-accelerator/images/SXA-headless-floating-toolbar-promo.png)

5. To apply styles to the Promo component, in the **Styling** section, select a style and click **OK**.

    ![Select a style](https://doc.sitecore.com/api/markdown-image/xp/en/users/sxa/105/sitecore-experience-accelerator/images/SXA-headless-promo-styles.png)

> [!note]
> You can create the Promo component before or while adding the Promo component to your page. It is stored in the following location:
>
> `Sitecore\Content\<site collection>\<site>\Data\Promos`