New Arrival in Title

[kennams]

Hello,

I am wondering if there is a way to add a New Arrival notation above the product title like in this image? I know how to create a collection, but I'd like to have it shown on each of the products as well. I currently have the Debut theme, so I am not sure if it's theme specific to be able to do this or an app, etc. Thank you!

[JoesIdeas · Accepted solution]

You can do this with some Liquid code.

First find the file that displays the product thumbnails. It's usually a snippet like product-thumbnail.liquid, product-card.liquid, etc.

Then read the code to see where the product title is being displayed. It might be something like <h2>{{ product.title }}</h2>

Then you can put your custom code above that.

This should do it:

{% assign created = product.published_at | date:'%Y%m%d' %}
{% assign today = 'now' | date:'%Y%m%d' %}
{% assign diff = today | minus: created %}
{% if diff < 30 %}<p class="new-arrival-badge">NEW ARRIVAL</p>{% endif %}

You can change the number 30 to whatever cutoff you want for the number of days it's considered "new".

You can style the text using a .new-arrival-badge CSS class.

You can swap NEW ARRIVAL text for an image if you want.

[kennams]

Thank you so much, that worked!! I really appreciate it!

[JoesIdeas · Accepted solution]

UPDATE (I wasn't able to edit my previous answer):

That solution I used doesn't account for carrying over to the next month.

The better solution is to do the math difference by seconds first, then convert to days.

Here is the new logic snippet:

{% assign created = product.published_at | date: '%s' %}
{% assign now = 'now' | date: '%s' %}
{% assign diff = now | minus: created | divided_by: 3600 | divided_by: 24 %}
    
{% if diff < 39 %}<!-- Do stuff -->{% endif %}
    

[kennams]

Thank you so much for the update! I will add that code!

[BugShallNotPass]

In case you want to create a standalone collection with all the new arrival products you might want to use a tag-based solution. You can tag your products with new-arrivals (or similar) and then create an automatic collection with a condition like Product tag is equal to new-arrivals as per below:

Try using the New Arrivals Shopify app if you want your products to be automatically tagged with any tag defining a "new arrival". It can automatically tag and untag products based on creation or publishing date. You can set up a concrete period of time the products should be considered to be "new". Although you would still need to make a front-end theme adjustment to show the badge, the app will help you avoid manually keeping track of those products i.e. it will automatically remove the tag after a specified period of time.

I hope the above might be helpful to you anyone looking for a similar solution.

[superfinds888]

hi there, I added the code to two areas I see the words  "product title" (See pics below) but it didn't work.  Please help.  Thanks, Di

I added the