presentation of images in product list

Hi, Is it possible to display images of products in the way as presented below?





when I setup System – Configuration – Images options “image scale mode: keep ratio” and “force image size: yes”
I get presentation as presented below - images are well resized but they are presented in the “boxes” so there is a lot of space between horizontal and vertical images


Regards,
Greg

Hi,

First you want to turn off the "force size" setting and you want to specify a height but no width in the thumbnails size setting of your menu item.
That way, each image will have the same height, but it width will vary based on the ratio of the image, like you need them to be.
However, each row will still have the same number of products. To change that, you'll have to add custom CSS in order to have them arrange dynamically like you need them.
With the appropriate custom CSS, you should be able to do what you have in your first screenshot.
However, with just the options, it's not possible.

Hi Nicolas, thank you for your feedback !
could you indicate how this change in CSS should look like ? I know it's a big expectation, but it's worth asking

Regards,
Greg

Hi,

Well, I don't know excatly. It would require some proper testing. A web designer knowing well CSS will probably spend one or even several hours to be able to write the proper CSS while testing things out.
It's not just one or two simple lines I could provide off the top of my head.

Hi Nicolas, understood, thank you for the information
Regards,
Greg

Hi, Once again thank you for your response but I would like to back to my topic with additional question – Is it possible to use for display of images in product list solution based on masonry.desandro.com/ ?

Regards,
Greg

Hi,

You could but it will be more complex as you'll have to rewrite PHP, add the javascript library and integrate it to the page, and maybe tweak the CSS to adapt that library default display to your needs.
So I would still recommend to go with just the CSS customizations like I was saying before.

Hi, ok, thank you for your suggestions
Regards,
Greg