Hello,
I have been having a problem with the number of product rows displayed on our website rheakalo.com. No matter what I change on the back-end it seems to be stuck to only displaying 3 rows of products. https://rheakalo.com/collections/food-for-thought
I urgently need to change this! Help!
Thank you!
Hi @RheaKalo
let try to add this Custom CSS to your theme settings:
@media only screen and (min-width: 750px) {
.medium-up--one-quarter {
width: 33.33333%;
}
}
then result:
No this did not work.
I do not want 3 products per row. I want MORE THAN 3 ROWS per page. At the moment my collection pages are limited to 3 rows.
did you check any configure to increase item per page? currently it’s 25 products per page
How do i do that?
I currently have 4 products per row, and all my pages are stuck at 3 rows. I have changed this to 7, but it doesn’t actually show that on the live page.
I’m not sure which theme are you using but you can try to open Theme Customize, navigate to Collection page and find any configure like Products per page
No, this doesn’t work
which theme are you using?
let try to go to main-collection-product-grid.liquid then try to fill your number here
Hi @RheaKalo
You can try to follow this step
Step 1: Go to Edit code
Step 2: Find file theme.scss.css and add this code at the end of the file
@media only screen and (min-width: 750px) {
.grid--uniform .medium-up--one-half:nth-child(odd), .grid--uniform .medium-up--one-third:nth-child(3n+1), .grid--uniform .medium-up--one-quarter:nth-child(4n+1), .grid--uniform .medium-up--one-fifth:nth-child(5n+1), .grid--uniform .medium-up--one-sixth:nth-child(6n+1), .grid--uniform .medium-up--two-sixths:nth-child(3n+1), .grid--uniform .medium-up--three-sixths:nth-child(odd), .grid--uniform .medium-up--one-eighth:nth-child(8n+1), .grid--uniform .medium-up--two-eighths:nth-child(4n+1), .grid--uniform .medium-up--four-eighths:nth-child(odd), .grid--uniform .medium-up--five-tenths:nth-child(odd), .grid--uniform .medium-up--one-twelfth:nth-child(12n+1), .grid--uniform .medium-up--two-twelfths:nth-child(6n+1), .grid--uniform .medium-up--three-twelfths:nth-child(4n+1), .grid--uniform .medium-up--four-twelfths:nth-child(3n+1), .grid--uniform .medium-up--six-twelfths:nth-child(odd) {
clear: unset !important;
}
.medium-up--one-quarter {
width: 14% !important;
}
}
Result
Best,
DaisyVo
This just increases the number of plates on each row. I need to have more rows, not more items per row.
Does that make sense? I appreciate the help!
Where though? You mean delete the highlighted text and replace with a number? Can you please let me know exactly what the code should look like? Thank you!
