Try adding this CSS code to the bottom of styles.css
.woocommerce ul.products li.product {
width: 21.75%;
}
mark, .mark {
background-color: transparent;
}
Hey thanks for your response,
I still have the products going only 2 wide 🙁
my website
EDIT: I see default.css is overriding changes on styles.css.
Try using this instead:
.woocommerce ul.products li.product {
width: 21.75% !important;
}
mark, .mark {
background-color: transparent !important;
}
woo-hoo! your a champ, how do I customize how many are placed in each row ? (theres still lots of blank space to the right ) 😛
also It now looks crazy when I check it out on my phone :/
You can customize how many are in each row by changing the width. So if the width were smaller such as 17% it should fit 5 or if the width was 29% it should fit 3.
This should get the products more centered on the page.
.col-md-7 {
width: 95% !important;
}
If products aren’t all showing up in one row it means that your product picture aspect ratios are different so you’d need to fix it by hard cropping pics and maybe regenerating thumbnails.