custom text Badge (perfume I inspiration text

[NOOR456]

Hi All, 

Please I need help , I tried to add a customer badges on my perfume store to show a text on top of the card but it won't work ? 

 1. *Add a Product Metafield in Shopify:*
1. Go to your Shopify admin.
2. Click on *Settings* at the bottom-left corner.
3. In the Settings menu, click *Custom data* (or *Metafields*).
4. Under *Products, click on **Add definition*.
5. Fill out the details:
- *Name:* Inspiration Text Badge
- *Namespace and key:* custom_badge.inspiration
- *Description:* (Optional) Add description if needed.
- *Content type:* Choose *Single line text*.
6. Click *Save*.






1. In the *Sections* or *Snippets* folder, find a file that contains the product card template, like product-card.liquid or product-grid-item.liquid.

liquid
{% if product.metafields.custom_badge.inspiration %}
<span class="custom-text-badge">
{{ product.metafields.custom_badge.inspiration }}
</span>
{% endif %}


*Step B: Modify the Product Page Template (to display badge on product pages)*



liquid
{% if product.metafields.custom_badge.inspiration %}
<div class="custom-text-badge">
{{ product.metafields.custom_badge.inspiration }}
</div>
{% endif %}


#### 4. *Add Styling to the Badge:*

To style the badge, you’ll need to add some CSS:

1. In the *Assets* folder, find your theme’s CSS file (theme.css, style.css, etc.).
2. Add the following CSS to style the badge:

css
.custom-text-badge {
background-color: #f8e71c; /* Customize background color */
color: #000; /* Customize text color */
padding: 5px 10px;
border-radius: 4px;
font-size: 14px;
font-weight: bold;
display: inline-block;
margin-top: 10px;
}

Please note products_liquid there are 1-5 pages , I can't find the default one check attached 

[PaulNewton]

Hi @NOOR456 👋 Did you give the metafields values in each products admin?

Beyond that you must make efforts to communicate details others need to understand problem.

Always remember others cannot see what you see, nor do we have the same store theme or setup or products.

What exactly "isn't working", is there an inspectable url, did you make a small test case to validate logic, etc etc

https://community.shopify.com/c/blog/how-to-get-support-from-the-community/ba-p/1399408 

https://stackoverflow.com/help/minimal-reproducible-example 

If you need this customization fixed for you then contact me for services
Contact info in forum signature.
ALWAYS please provide context, examples: store url, theme name, post url(s) , or any further detail in ALL correspondence.

[NOOR456]

Hi Qasem, 

thank you , could you please drop your contact details