Product collection pages rendered unformatted: a large arrow and oversized, uneven product images in a single column, instead of the expected 4-per-row grid.
Configuration appeared correct; an example link was shared.
Initial suggestion: a CSS error (e.g., missing closing bracket) or deleted CSS file. The store owner restored older versions, but the issue persisted, suggesting CSS wasn’t the root cause.
Resolution: The owner copied the JSON from a working collections template (“collections-boost-sd”) and replaced the JSON of the Default Collections template entirely. (Template JSON = layout/configuration data.)
Outcome: Layout returned to normal; problem solved.
Status: Resolved. Likely cause was corrupted/misconfigured template JSON rather than stylesheet issues; no outstanding questions or further actions noted.
Hi there!
For some reason, my product collection pages are completely unformatted. They show a huge arrow and extra large and unequal products images in a single column.
This is an example: https://beamalevich.com/collections/ceramic-figures
I originally displayed a product grid of 4 products per line.
That’s what I really want! All the configuration seems okay.
I have no idea what is wrong.
Has anyone encountered this? Does anyone know how to solve it?
that problem come when you can edit the css file and miss any closing bracket you have need to check the code last time that you can edit.
hope so you did not delete any css file…
Hey there, I have just checked and even restored old versions but the PROBLEM CONTINUES.
Thank you though.
SOLUTION FOUND:
I have been able to solve it by copying and pasting the JSON code from a different Collections template that I saw works correctly. (“collections-boost-sd” template)
I completely substituted the code on my Default Collections template for another one and now it works :-------------)
that good best wishes