Add a free shipping bagde on main home page under item picture and on item page under the price

Store Design
, , ,

Topic summary

A user working with Shopify’s Dawn theme is attempting to add a “FREE SHIPPING” badge to their store in two locations: on the main landing page under product images and on individual product pages under the price.

Current Issue:

  • The user has written code for the badge (including styling with specific colors, fonts, and conditional logic based on product tags)
  • The badges either don’t appear or display in incorrect positions
  • Images were attached showing the desired badge appearance and placement

Response & Status:

  • A community helper confirmed the code itself appears correct but the placement/implementation is wrong
  • Without access to the theme’s actual code files, they cannot specify the exact file location (likely related to card-product.liquid in Dawn theme)
  • Different templates render sections differently, making it impossible to provide precise guidance through forum posts alone
  • The helper offered to implement the changes directly if given access to the code

Resolution: The discussion remains unresolved, requiring either hands-on code review or more detailed information about file structure to properly place the badge code.

Summarized with AI on November 14. AI used: claude-sonnet-4-5-20250929.
1

Hello,

I am using the Dawn theme and I am trying to add a badge on the main landing page and on the item page. My site is globalvolunteerrecognitionprogram.com. The code that I am trying is below. I have attached picture of what the badge should look like and where I would like it to be. I have tried to make it work but the badges are not showing up or they are in the wrong spot. I appreciated any gudiance you can give me. Thanks!

{% if product.tags contains ‘freeshipping’ %}

FREE SHIPPING

{% endif %}

2_20231129_152915_0001.png
2_20231129_152915_0001.png2560×1447 510 KB

1_20231129_152915_0000.png
1_20231129_152915_0000.png2560×1447 242 KB

2

Hi @globalvolunteer I think your code is correct but your placement is not, you need to look into the placement and without looking into your theme code I will not be able to provide you the exact place where you can place this, so it will work for you.

If you will unable to implement the same then I’m happy to do this for you, let me know. I can implement the code changes so that this will work well for you.

Hopefully it will help you. If yes then Please don’t forget hit Like and Mark it as solution!

Best Regards

Sahil

3

Hello,

I am not sure where to put the code and that is why I posted on the board. I am using the Dawn theme. Which part of the code are you needing to look at? Card-product.liquid?

4

Hi @globalvolunteer I can’t tell you the exact file or file name without looking into the code file, and I am afraid that if you will paste the code here then also it will not make that much difference because as you know that different template use to render different section, so I need to look into that.

And you will be unable to paste all the code here, and even if you do manage to paste it here, I will not be able to take the look into the code here.

If you need any other help then please feel free to ask the same.

Hopefully it will help you. If yes then Please don’t forget hit Like and Mark it as solution!

Best Regards

Sahil