Does anyone know if a banner or header can a included as option that can be turned and off?? Rather than having to create separate product images, ideally an option to write headlines would be preferred. Examples of what I’d like to achieve attached.
Hey @Darren_Hebrard
Welcome to the community!
Yes that is possible and I’m guessing you would want that the text in that bubble to different every product so it will be a combination of both metafields and liquid coding within your theme files.
That’s a custom liquid work and I can’t help you directly without having to know more about your theme, or if it’s easier then you can just share the collaborator request code in my pirvate messages and I can take care of the rest and explain you how you can edit the text product-wise.
Let me know what works the best for you.
Cheers,
Moeed
Hi there 
From your example, it sounds like you’re looking for a way to display a banner, headline, or custom text as an optional element that customers can turn on or off, without having to create separate product images for every variation.
You may want to take a look at Easify Custom Product Options
To give you a better idea, I created a similar demo where customers can enter custom text and instantly see it displayed on the product image through Live Preview.
- This is the result:
- This is the app setting:
With Easify, you can create a Text box option such as “Names”, “Year”, or any other label you’d like. Then, in the Product Personalizer, you can add a text layer that will appear on the product preview.
Next, go to Advanced Settings and enable Conditional Logic. This allows you to control when the text layer should be displayed. For example, when the customer checks the checkbox, the headline field and banner layer appear. If they uncheck it, both the field and the banner can be hidden automatically.
After that, simply enable Live Preview in the Product Personalizer. As customers enter their headline or promotional message, the text is rendered directly on the product image in real time, similar to the ornament example above.
Another advantage is that if you don’t want to create and maintain separate product images for every headline, promotion, or banner variation, you can assign the same option set to multiple products at once. Simply select the products you want the personalization to apply to, and the same live-preview setup can be reused across your catalog. This makes it much easier to manage seasonal campaigns, promotional messages, or custom headlines without having to upload dozens of image versions for each product.
What I like about this setup is that you don’t need to generate multiple versions of the same product image. Everything is managed through layers inside the app, making it easy to turn banners, headlines, seasonal messages, or promotional labels on and off while letting customers immediately see the final result 
@Darren_Hebrard ,
Yes, The best approach is to use a product metafield so you can enable/disable the banner and change the text from the Shopify admin without touching the images.
Create a Product Metafield
Go to Settings → Custom data → Products → Add definition
Create:
-
Name: Product Banner
-
Namespace and key:
custom.product_banner -
Type: Single line text
Step 2: Add this code to your product template
Open:
sections/main-product.liquid
Find the product media/image section and add
{% if product.metafields.custom.show_banner %}
<div class="product-banner">
{{ product.metafields.custom.product_banner }}
</div>
{% endif %}
If you dont want the toggle metafield simply use
{% if product.metafields.custom.product_banner != blank %}
<div class="product-banner">
{{ product.metafields.custom.product_banner }}
</div>
{% endif %}
Add CSS
In assets/base.css (or theme.css)
.product-banner{
position:absolute;
top:25px;
left:25px;
background:#fff;
color:#ff4a00;
border:2px solid #ff4a00;
padding:12px 20px;
font-size:16px;
font-weight:700;
text-transform:uppercase;
z-index:10;
border-radius:4px;
}
Make sure the image wrapper has
.product__media{
position:relative;
}
Result Now, from the Shopify Admin for each product you can simply enter
NEW ARRIVAL
or
LIMITED EDITION
or
PRE-ORDER
or leave it blank to hide the banner.
No image editing is required and you can change the message for each product in seconds.
Hello, @Darren_Hebrard
Hope you are doing great!
If you’re comfortable with a little theme customization, this can be done by adding a toggle and text fields as product metafields. You can then show or hide a banner on the product page without creating separate product images.
Yes, you can absolutely do this with a product metafield, and it’s a clean solution.
Create a product metafield (for example, custom.banner_text) and optionally another one like custom.show_banner (True/False). Then update your product image template to display the banner only when the toggle is enabled and the text exists.
{% if product.metafields.custom.show_banner and product.metafields.custom.banner_text != blank %}
{{ product.metafields.custom.banner_text }}
{% endif %}
.product-banner {
position: absolute;
top: 12px;
left: 12px;
background: #000;
color: #fff;
padding: 8px 12px;
font-size: 14px;
font-weight: 600;
border-radius: 4px;
z-index: 10;
}
.product-media {position: relative;}
Hi @Darren_Hebrard ,
Yes, this is possible. Instead of creating separate product images, you can add a custom metafield for a product banner/text and display it conditionally in your product template. That way, you can simply enter or remove the headline from the product admin, and it will show or hide automatically. This is much easier to manage and keeps your product images clean.
{% if product.metafields.custom.banner_text != blank %}
<div class="product-banner">
{{ product.metafields.custom.banner_text }}
</div>
{% endif %}
.product-banner {
display: inline-block;
padding: 12px 24px;
border: 2px solid #ff5a3c;
color: #ff5a3c;
font-size: 18px;
font-weight: 600;
text-align: center;
margin-bottom: 20px;
background: #fff;
}
This approach is easy to manage from the Shopify admin and avoids editing product images whenever the banner text changes.