Is there a way to modify the size of the images in the category block image grid?

Hi, I’d like to modify the image size of the listing category block
I’ve found the .hp-row and hp-listing-category__image classes but I cannot modify the width.

My goal is to reduce the image size when on mobile phone.
If not possible, I’d like to hide this block on mobile phones and display another


Please check this topic Changing image size of categories on front page - #3 by hubub

​I hope this is helpful to you.

thank you for the snippet.
I already used this snippet and it works (I’ve modified the size to 200px).
But when I reduce the size of the screen, I obtain a BIG thumbnail, as large as the scrren !
Maybe it is because the thumbnail is configured to occupy all the width but I don’t know how to change that ratio.


Yes, this is expected behavior. You can solve this with two options:

  • display categories in two columns
  • reduce the height of categories

But please note that these two options will require custom implementation.

Ok, I will try this.
Can you just tell me wich existing class I should select ?
Thank you for your help


You can try to use these classes - .hp-listing-category--view-block.

This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.