> ## Knowledge Base Index
> Fetch the complete knowledge base index at: https://help.ecomx.co/sitemap.xml
> Use this file to discover available pages before exploring further.
> Pure-Markdown content can be obtained by appending a '.md' suffix to the content URLs listed in the sitemap (without the trailing slash).

# Electro How to Create Prominent Badges for Collections in Electro

**Theme:** Electro · **Section type:** Theme setting

Prominent badges add a short, colored label, such as "New in" or "Sale off", to the corner of a collection card. Use them to draw customers to the collections you want to promote.

> **Note:** Badges show on every collection card in the store: in Collection list sections and on the collection list page. You create each badge once in the Shopify admin and then assign it to collections.
![Collection card with an UPTO 5% OFF prominent badge (Electro preset)](https://storage.crisp.chat/users/helpdesk/website/-/f/8/b/b/f8bb8da391016800/badge-1_10jdk9n.png)

**What you can do**
- Create the Badge metaobject
- Create your badges
- Connect badges to collections
- Assign a badge to a collection
- Turn on prominent badges
- See what customers see
- Fix common problems

---

## Create the Badge metaobject
The metaobject is the template that every badge follows.

1. In the Shopify admin, go to **Settings** > **Custom data**.
2. Under **Metaobjects**, click **Add definition**.
3. Name it **Badge**.
4. Add a **Single line text** field named **Content**. This is the badge text.
5. Add a **Color** field named **Color**. This is the badge background.
6. Click **Save**.

> **Caution:** The theme reads the fields by their keys, **content** and **color**. If you rename them, check that the keys are still **content** and **color**, or the badge won't show.

## Create your badges
1. In the Shopify admin, go to **Content** > **Metaobjects** and click **Badge**.
2. Click **Add entry**.
3. Enter the **Content**, for example "New in".
4. Choose a **Color** for the badge background.
5. Click **Save**. Repeat for each badge you need.

## Connect badges to collections
1. In the Shopify admin, go to **Settings** > **Custom data** > **Collections**.
2. Click **Add definition**.
3. Enter a name, for example "Badge", and set the namespace and key to **collection.badge**.
4. For the type, choose **Metaobject** and select **Badge** as the reference.
5. Click **Save**.

## Assign a badge to a collection
1. In the Shopify admin, go to **Products** > **Collections** and open a collection.
2. In the **Metafields** section, click **Badge**.
3. Select the badge entry you created.
4. Click **Save**.

## Turn on prominent badges
1. In the theme editor, click **Theme settings** > **Collection card**.
2. Under **Prominent badge**, check **Enable prominent badges**.
3. Click **Save**.

> **Tip:** Keep badge text to one or two short words. Long text can cover the collection image on small cards, especially on mobile.

## What customers see
- **Collection cards:** the badge appears in the top-right corner of the card, with your text in capital letters on your chosen background color.
- **Every collection list:** the same badge shows wherever the collection card appears, in Collection list sections and on the collection list page.
- **Collections without a badge:** their cards look as before.
![Collection list page with NEW IN and SALE OFF badges in different colors (Skatewear preset)](https://storage.crisp.chat/users/helpdesk/website/-/f/8/b/b/f8bb8da391016800/badge-2_1hwm8y4.png)

## Settings reference
### Theme settings > Collection card > Prominent badge
| Setting | What it does |
| ---- | ---- |
| Enable prominent badges | Shows the badge assigned to each collection on its collection card. |

## Troubleshooting
**The badge doesn't show on the collection card.**
Check that **Enable prominent badges** is on in **Theme settings** > **Collection card**, and that the collection has a badge selected in its **Badge** metafield.

**The badge shows but it's empty.**
The theme reads the text from the **content** field. Check that the metaobject field key is **content** and that the badge entry has text.

**The badge has no background color.**
Check that the metaobject field key is **color** and that the badge entry has a color.

**The badge doesn't appear for any collection.**
Check that the collection metafield namespace and key is exactly **collection.badge** and that its type is **Metaobject** with **Badge** as the reference.

## Related articles
- [Electro How to Use Electro Collection List](https://help.ecomx.co/en/article/electro-how-to-use-electro-collection-list-xrdc5h/)
- [Electro How to Create Electro Collection List Page](https://help.ecomx.co/en/article/electro-how-to-use-electro-collection-list-template-j92uoh/)
- [Electro Theme Settings](https://help.ecomx.co/en/article/electro-theme-settings-2ubwqk/)
- [Electro How to Set Up Product Metafield](https://help.ecomx.co/en/article/electro-how-to-set-up-product-metafield-1u6pmhk/)