Page 1 of 1
Product Listing
Posted: Thu Oct 28, 2021 6:05 pm
by LeeFoster
Am I missing something?
I am trying to sort my products by Model number but it's not showing on the product listing page and I can't see how to turn it on.
I'm also trying to change it to show 3 in a row not the current 4.
Re: Product Listing
Posted: Thu Oct 28, 2021 6:36 pm
by ReneH4
Admin > Configuration > Product Listing > Products per Row
Products Per Row
How many products should display per Row per viewport? Default: XS 2, SM 3, MD and above 4
LeeFoster wrote: ↑Thu Oct 28, 2021 6:05 pm
I'm also trying to change it to show 3 in a row not the current 4.
Re: Product Listing
Posted: Thu Oct 28, 2021 6:44 pm
by LeeFoster
ReneH4 wrote: ↑Thu Oct 28, 2021 6:36 pm
Admin > Configuration > Product Listing > Products per Row
Products Per Row
How many products should display per Row per viewport? Default: XS 2, SM 3, MD and above 4
LeeFoster wrote: ↑Thu Oct 28, 2021 6:05 pm
I'm also trying to change it to show 3 in a row not the current 4.
Yeah I found it in the end. Need to work out how to add white background to make all the images appear the same height now.
See here for an example -
http://witchwindgames.atwebpages.com/in ... ?cPath=6_5
Re: Product Listing
Posted: Thu Oct 28, 2021 8:10 pm
by ReneH4
How very nice the Modal popup looks after adding a product! Well done Lee!
Re: Product Listing
Posted: Fri Oct 29, 2021 12:20 pm
by Omar_one
LeeFoster wrote: ↑Thu Oct 28, 2021 6:44 pm
Need to work out how to add white background to make all the images appear the same height now.
You can use KissIT Image Thumbnailer
app.php/addons/free_addon/kissit_image_thumbnailer/
Or you can add some stylish to user.css ( this will not add white background to the images , but it make the images appear the same heigh)
Code: Select all
.card-img-top {
object-fit: cover;
}
/* Small devices (landscape phones, 576px and up) */
@media (min-width: 576px) {
.card-img-top {
height: 19vw;
}
}
/* Medium devices (tablets, 768px and up) */
@media (min-width: 768px) {
.card-img-top {
height: 16vw;
}
}
/* Large devices (desktops, 992px and up) */
@media (min-width: 992px) {
.card-img-top {
height: 11vw;
}
}
/* Extra large devices (large desktops, 1200px and up) */
@media (min-width: 992px) {
.card-img-top {
height: 19vw;
}
}
Re: Product Listing
Posted: Fri Oct 29, 2021 1:02 pm
by heatherbell
LeeFoster wrote: ↑Thu Oct 28, 2021 6:44 pmNeed to work out how to add white background to make all the images appear the same height now.
Personally, we use image software to create and optimise our images and start with the same size square background/canvas when creating the images to ensure they are all same size.
Re: Product Listing
Posted: Fri Oct 29, 2021 1:40 pm
by LeeFoster
heatherbell wrote: ↑Fri Oct 29, 2021 1:02 pm
LeeFoster wrote: ↑Thu Oct 28, 2021 6:44 pmNeed to work out how to add white background to make all the images appear the same height now.
Personally, we use image software to create and optimise our images and start with the same size square background/canvas when creating the images to ensure they are all same size.
As do I but this website is for someone else.