Hello,
I’ve been trying to find a solution to this for a couple days now. And every solution I’ve tried gets universally applied to every page, rather than just the pages I intend to change. Hopefully someone can help me out. I am using the Dawn theme.
I want to change the number of products per row in my Featured Collections. Right now on my homepage, I have a featured collection with the option to show 2-12 products (in increments of 2) with 4 products per row. This is the default setting on the Dawn theme. I want to keep it set at 4 products here on the home page.
My problem is that I want to change the number of products per row on my featured collections on my custom collection pages. I don’t use the default collection pages. Rather, I’ve created new page templates for each collection and link to these pages from the homepage. I want to change the number of products per row in the featured collections on these custom pages from 4 to 3, without altering the homepage featured collections.
I figured out how to do this successfully once months ago, but don’t remember how and can’t find the same solution again. One of my custom collection pages actually does have 3 products per row while the homepage has 4, so I know it’s possible. But I’m not familiar enough with code to know what I did last time or how to find what code I altered then.
So far I’ve tried editing the grid code in assets > base.css to have max width 33%, but that applies to all featured collections, including the homepage, not just the desired page.
Thank you,
Jack
Hi @JackPElliott ,
Please share your store URL and if your store is password protected then please provide password too, and take a picture of the section you want to show 3 rows.
So that we can help you.
Thank you.
- make sure you back up your theme*
click on actions edit code and go to the page you want to customize. it’s normally under templates inside the page.liquid for example
put
{% section 'featured-collection' %}
this should render the featured-collection grid inside your page and you can customize it inside the customize theme
password: haibao
I’ve attached an image of the custom page I want to have 3 products per row. It’s important to note that you get to this page from the homepage > top menu > collections > golf group text.
If you click on View All under the featured collection on the homepage, unfortunately it brings you to the default collection page, rather than my desired custom collection page. This is also true when clicking the on the various collections down below on the collection list; they link to the default collection pages rather than the proper custom ones. Linking to the proper custom pages is the next thing I’m trying to fix. Would be great if you could help with this as well.
If possible, please take screenshots and/or copy the parts of code you add/change so that I can see, so that I can do this myself next time. Not sure if that’s standard practice, this is my first time letting someone edit my site’s code.
Thanks,
Jack
oh, I see what you’re saying, my bad yeah you’re going to have to make a whole new custom file. you can copy and past the featured. liquid call it something like featuredThree.liquid and take out the code that says
grid--4-col-desktop
and change it to
grid--3-col-desktop
make sure you change schema to reflex the changes and copy the code example i gave you on the last reply, if it still doesn’t work you need to know schema or css to change it. Hire out someone could do it for you in 1 hour of work
Thank You! Making a new asset based on the default featured collection worked! However, I must’ve done something slightly wrong because while the new asset does technically work, it says “missing translation” all over the settings bar. Any idea what I need to change in order to fix this? As far as functionality goes, the new featured-collection-three.liquid asset does work properly, but I figure it’s probably best practice to fix whatever is causing the “missing translation”.
Thanks,
Jack
update: I solved this myself. Had to go into the code for the Locales en.default.scheme.json and copy the code for the featured collection and paste it underneath, changing the name to featured collection three.
