Add 'More Colours Available' to collection page

Technical Q&A

Topic summary

A user running Shopify’s Dawn 15 theme wants to add “more colours available” text to their product collection/grid pages, specifically beneath product prices. This helps customers identify items with multiple color variants.

Initial Solutions Offered:

  • One approach suggested using the Customize tool to add a text block under product information (no coding required)
  • Another provided custom code for main-product.liquid file

Current Focus:
The discussion evolved to adding this text specifically to the product grid/collection page rather than individual product pages. A custom code solution was provided for snippets/card-product.liquid (line 159).

Refinement in Progress:
The user requested the text appear only for products with multiple color options. After testing several code iterations checking for color variants, the latest solution partially works but displays the text in the wrong position—it appears above the product title instead of below the £28 price.

Status: Ongoing troubleshooting to correct text placement on the collection grid page.

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

Hi @ACEOFIRON You need to change the code in your theme files to achieve the same.

Please add the below code:


more colours available

Please follow the steps:

  1. Login in shopify admin.
  2. Click on the Online Store.
  3. Then click on the button next to Customize in live Theme.
  4. Click Edit Code.
  5. Search main-product.liquid in the code in left hand side in your theme.
  6. Add the following code after line number 121, if you didn’t changed anything in your theme earlier.
  7. If you have changed any code in this file earlier then search “product__tax” and add the code just outside the “If” statement.

Here is the screenshot for your help:

sahilsharma9515_0-1729668786111.png
sahilsharma9515_0-1729668786111.png1033×756 80.1 KB

After this add this code:

Please follow the steps:

  1. Login in shopify admin.
  2. Click on the Online Store.
  3. Then click on the button next to Customize in live Theme.
  4. Click Edit Code.
  5. Search theme.liquid in the code in left hand side in your theme.
  6. Add the following code in the bottom of the file above tag

Result:

sahilsharma9515_1-1729668893981.png
sahilsharma9515_1-1729668893981.png747×274 13 KB

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

Best Regards

Sahil