if you notice the price on my product page is in red and the full price in grey, however if I go to the collection or if you go to the home page in the scrolling collections this price is not shown like this but classic both in black, how can I correct this?
Topic summary
A user reports inconsistent price styling across their Shopify store: product pages correctly display sale prices in red with original prices in grey, but collection pages and homepage scrolling collections show both prices in black.
Two solutions were provided:
-
PageFly-Richard’s approach: Add custom CSS code to the theme.liquid file, placed above the
</head>tag (though the actual code snippet appears incomplete in the thread). -
KetanKumar’s solution: Insert specific CSS targeting sale price elements into the theme.css file:
- Makes sale prices red (#cc0d3a)
- Keeps original prices in the default color variable
- Includes a screenshot demonstrating the expected result
Implementation path: Both solutions require accessing Online Store > Themes > Edit code, then modifying either theme.liquid or theme.css files.
The issue remains open as the original poster hasn’t confirmed whether either solution resolved the styling inconsistency.
1 Like
@lf_2
Sorry you are facing this issue,
It would be my pleasure to help you.
Please share your site URL,
I will check out the issue and provide you with a solution here.
Hi @lf_2 ,
Thank you for reaching out to the Shopify community. I’d be glad to assist you. Could you kindly share your store URL and
password (if it’s password-protected) so I can review it and provide you with an update?
tilma.it
1 Like
tilma .it
1 Like
Hi @lf_2
This is Richard from PageFly - Shopify Page Builder App
Please add this code to your theme.liquid above the to get this solved
Step 1: Online Stores > Themes > More Actions > Edit code
Step 2: click on theme.liquid and paste the code above the
Hope this can help you solve the issue
Best regards,
@lf_2 thanks for url can you please try this code
- Go to Online Store->Theme->Edit code
- Asset->/theme.css ->paste below code at the bottom of the file.
.grid-product__tag--sale + .grid__item-image-wrapper .grid-product__price {color: #cc0d3a;}
.grid-product__tag--sale + .grid__item-image-wrapper .grid-product__price .grid-product__price--original {color: var(--colorPrice);}
pleaser check attachment
