Thats amazing, thank you so so much
Topic summary
Main issue: On the collection (product listing) page, product name and price were overlaying the product image; they previously appeared below. The merchant uses a purchased theme and couldn’t adjust placement via theme options.
Initial suggestion: Add CSS to change text color to white (#fff) for price and description selectors. This didn’t address the overlay and was unsuitable for pages with white backgrounds.
Resolution: Add a Custom CSS rule to reset the title’s positioning:
- h4.des-font.capital.title-product.mb-0 { position: initial; }
This returns the element to normal document flow, moving the product title (and associated details) below the image. A screenshot confirmed the corrected layout.
Outcome: Merchant confirmed the fix worked (“all sorted”). No further actions required.
Notes: Code snippets and screenshots were central to the solution. The issue concerned CSS positioning on the product listing page rather than color styling.