Adding in extra text on product collections page

[Ashleigh_Gill]

Hi,

We would like to show our end users that we offer finance/payment plans but I can’t find anywhere to put this. Please can someone help?

Ideally want it to look like this…

This is how it currently looks…

Thanks,

[Moeed]

Hey @Ashleigh_Gill

I’m guessing you wanna display it in your product cards or on your collection page, since you can’t directly edit it from customization so you will have to make changes within your theme files, most likely in a file called product-card.liquid and then in that file you can make your changes to add the line.

Of course, it will require some changes in your theme files so if you’re not familiar with coding then I would highly recommend you to hire a Shopify developer who can help out with that. If you’d like my help then feel free to connect with me and I would be more than happy to help out.

Best,

Moeed

[FernandoDaniel]

Hi Ashleigh_Gill

Shopify doesn’t have a dedicated field for “Payment plans available” text out-of-the-box, so you’ll need to add this directly into your theme’s code.

I have a couple of questions:
a) It is a generic message or it includes dynamic data depending on each product?
b) The text is meant to be displayed in Collections Pages only or in Product Pages as well?
c) What kind of theme do you use? Liquid, Hydrogen, Custom storefront?

I will share with you a quick guide if you are using a generic message in Collection Pages in a Liquid theme :

1. Backup Your Theme

2. Locate the Product Card Snippet (for Collection Pages & Other Grids):
   Go to code editor. Look for the corresponding file in the Snippets folder. Example:
   card-product.liquid (for Dawn theme)

   Inside this snippet, look for where the product price is displayed. You’ll see Liquid code like:
   {{ product.price | money }}, {{- product.price | money -}}, {{ variant.price | money }}, or elements with classes like price, product-price.

3. Add Your Text:
   Directly below the price element or its container, add your HTML:

Payment plans available

​

Or, if you want it to be configurable via Theme Settings (recommended):

{%- if settings.show_payment_plan_text and settings.payment_plan_message != blank -%}
  

{{ settings.payment_plan_message }}

{%- endif -%}​

• 4. (Optional but Recommended) Add Section Settings for Control:
  This allows you to easily turn the message on/off and change the text from the Theme Customizer without editing code again.

  a. In the code editor, open config/settings_schema.json.
  b. This file is a JSON array. Find a logical place to add new settings, perhaps within an existing section related to “Products” or “Product cards,” or create a new one.
  c. Add the following JSON block (ensure correct comma placement if adding within existing objects):

{
      "type": "checkbox",
      "id": "show_payment_plan_text",
      "label": "Show 'Payment plans available' text",
      "default": true
    },
    {
      "type": "text",
      "id": "payment_plan_message",
      "label": "Payment plan message",
      "default": "Payment plans available"
    }​

5. Style with CSS:

Example:

.payment-plan-info {
  font-size: 0.85em; 
  color: #5c5c5c; 
  margin-top: 5px; 
  margin-bottom: 8px; 
  line-height: 1.3;
}

This is a quick solution for your question, but you can scale it to make it more specific for Collection or Product pages, include translations, dynamic content with Metafields, etc.

[Ashleigh_Gill]

Hi,

Thank you for your response.

“Payment Plans Available” is to be on every product regardless of collection. Not required on product as we have this highlighted with Clearpay/Klana.

Our theme is Concept from the shopify store.

Please can you advise which option would work best?

Thank you!

[FernandoDaniel]

Hi Ashleigh.

You can largely follow the steps I previously provided, but you’ll need to adapt them specifically for the “Concept” theme.

The “Concept” theme manages product cards via its Theme Settings, so you will need to identify the corresponding sections, snippets, elements, or classes apply the changes.

If you need help with the coding, you can contact a Shopify Developer for implementation. I’m also happy to assist with the code if you’re interested—just let me know.