We have been trying to change the way our Woocommerce product category thumbnails are currently displaying. Attached is the screenshot of how categories (and subcategories) are displayed now. I understand this is set at Woocommerce Category Display setting.
Is there a way to customize product category display in Kalium? Will appreciate a guidance on this.
Can you please tell us how you want them to be? Maybe you can send me a mockup and I can tell you if that can be achieved or not or send you the CSS code to do that change.
You are using an old version of our theme 3.1.2, the latest version for the moment is 3.3.1 (read release notes), please update your theme first and then the premium plugins too.
After you update the theme, there is a chance that we also updated some of the plugins that we offer. To update those plugins to the latest version that we support, just go to Laborator > Plugins.
Kalium theme is updated and we ran into another problem, which is urgent.
All Woocommerce product thumbnail images on product list / category pages have got distorted as the screenshot shows. The product frame / area got much elongated vertically and images are getting cut. Could you help fix it quickly.
One more request, can we force a line break in the product category text, some of the longer categories are getting cut off, screenshot attached. Can you advise additional CSS.
Another request, we were testing Customer Review in Woocommerce and see that review rating is coming as circle or dot, as opposed to Star, screenshot attached, Can you advise how to enable Stars in review rating?
We have been trying to change the way our Woocommerce product category thumbnails are currently displaying. Attached is the screenshot of how categories (and subcategories) are displayed now. I understand this is set at Woocommerce Category Display setting.
Is there a way to customize product category display in Kalium? Will appreciate a guidance on this.
Suparno
Hi Suparno,
Can you please tell us how you want them to be? Maybe you can send me a mockup and I can tell you if that can be achieved or not or send you the CSS code to do that change.
Thanks!
Hi Suparno,
You are using an old version of our theme 3.1.2, the latest version for the moment is 3.3.1 (read release notes), please update your theme first and then the premium plugins too.
After you update the theme, there is a chance that we also updated some of the plugins that we offer. To update those plugins to the latest version that we support, just go to Laborator > Plugins.
Thanks!
Hi Ylli,
Kalium theme is updated and we ran into another problem, which is urgent.
All Woocommerce product thumbnail images on product list / category pages have got distorted as the screenshot shows. The product frame / area got much elongated vertically and images are getting cut. Could you help fix it quickly.
We are updating all plugins.
Suparno
Hi Suparno,
Problem solved (see video).
So you can navigate to Customize > WooCommerce > Product Images to change your WooCommerce image settings.
Have a nice day!
Sorry Ylli - please ignore earlier message. After we installed the plugins, product thumbnail images are back on track. Thank you.
LMk if we need to do anything more at our end,
Suparno
Happy to hear that
I have replied to you the second that you wrote your last reply.
Thanks!
(Yup, we crossed messages! )
Thanks Ylli so much for fixing it quick and sharing the video, we should have done it ourselves but many thanks !
If you can guide us on the original ask on customizing category thumbnail.
Suparno
Hi Suparno,
Please add the code below to your Custom CSS area:
.woocommerce .shop-categories .product-category .woocommerce-loop-category__title, .woocommerce .shop-categories .product-category h3 { position: relative !important; text-align: center; top: auto; left: auto; transform: none; }Have a great day!
Hi Ylli ,
Thank you so much, perfect!
One more request, can we force a line break in the product category text, some of the longer categories are getting cut off, screenshot attached. Can you advise additional CSS.
Suparno
Hi Suparno,
I think we can do that. Please send me the exact URL of that page that you illustrated on your screenshot.
Thanks!
It's happening on several Category pages, wherever Category title is longer.
Here are a few examples,
https://www.craftmontaz.com/product-category/home-decor/fair-trade-home-decor/
https://www.craftmontaz.com/product-category/home-decor/american-decor/
https://www.craftmontaz.com/product-category/home-decor/mexican-decor/
Suparno
Thanks for your fast response.
You can add this CSS code:
.woocommerce .shop-categories .product-category .woocommerce-loop-category__title, .woocommerce .shop-categories .product-category h3 { text-overflow: ellipsis; white-space: nowrap; overflow: hidden; } .woocommerce .shop-categories .product-category .woocommerce-loop-category__title .count { float: left; text-align: center; width: 100%; }or you can do two categories per row (see example).P.S: If you enjoy our theme, you can head over to your Downloads tab and give it 5 stars. We will love you forever.
Thanks Ylli.
Let's try 2 categories per row. Could not exactly follow your video, under which section in Woocommerce ?
Suparno
Pl. ignore earlier message, my bad, I got it under theme > shop settings.
We are going with two Categories per row, looking better.
Many thanks for all your help and guidance,
Suparno
Hi Suparno,
Happy to hear that this is already resolved.
Have a great day!
Hi Ylli,
Thanks again.
Another request, we were testing Customer Review in Woocommerce and see that review rating is coming as circle or dot, as opposed to Star, screenshot attached, Can you advise how to enable Stars in review rating?
Suparno
Hi Suparno,
You have that option in this area: Laborator > Shop Settings > Product Page > Rating Style.
(view on a new page)
Have a nice day!
Thanks Ylli, I missed it, done.
Thanks !
Suparno
Hi Suparno,
Happy that I helped
Have a happy week!
P.S: If you enjoy our theme, you can head over to your Downloads tab and give it 5 stars. We will love you forever.
Yup, done,
Suparno
Thank you very much!
I will set this ticket as solved from here.
Sure
Suparno