I want to design how the sub-categories are displayed.
I dont find any way to design them. Please help me.
https://garagedoorshark.com/product-category/poly-bags/reclosable-bags/clear-reclosable-poly-bags/
This topic has 10 replies, 2 voices, and was last updated 7 minutes ago ago by Jack Richardson
I want to design how the sub-categories are displayed.
I dont find any way to design them. Please help me.
https://garagedoorshark.com/product-category/poly-bags/reclosable-bags/clear-reclosable-poly-bags/
Hello @shahar klamka,
Our theme offers the following settings available under Theme Options -> WooCommerce -> Shop Elements -> Categories: https://prnt.sc/qkqjcsrc_Z2p. Using these options, you can modify the layout of your categories.
If you prefer to create a custom design for the categories, you can explore the Archive Products Builder, which allows you to design layouts similar to this example: https://xstore.8theme.com/elementor3/grocery-mega-market/shop/.
Could you please provide us with an example of the category layout you would like to achieve? You may also refer to the documentation for the Shop Builder here: https://www.8theme.com/documentation/xstore/xstore-builders/xstore-products-archive-builder-with-elementor/.
Best regards,
Jack Richardson
8Theme Team
I tried to use Elementor. There is no way to show the categories grid by filter query. So it always shows all the categories.
For example:
https://garagedoorshark.com/product-category/poly-bags/reclosable-bags/
(I use product category grid)
Hello @shahar klamka,
You can review the Spotlight Categories widget, as it displays categories and subcategories based on the current query request on product archive pages.
If you require our assistance, please provide detailed information about the result you would like to achieve and the desired design of the categories. Screenshots, videos, or GIFs would be very helpful for illustrating your request.
Best regards,
Jack Richardson
The 8Theme Team
The Spotlight Categories widget is a carousel.
I need a grid. As we have sometimes many sub-categories.
Is there is no option for a grid? Its quite basic
Hello @shahar klamka,
Thank you for your message.
Currently, this option is not available yet, but we can create a custom CSS solution for you to display it in a grid layout. Could you please provide us with the URL of the page where you have added this widget and let us know how many columns you would like to have?
Best regards,
Jack Richardson
The 8Theme Team
https://garagedoorshark.com/product-category/poly-bags/reclosable-bags/
I want a grid of 4 columns. Thank you so much
Hello @shahar klamka,
Please check it now. We have added the following custom CSS code to your Spotlight widget (https://prnt.sc/xgT_IyCEOwGd):
selector .etheme-category-grid-image.rounded img {
aspect-ratio: 1/1;
object-fit: cover;
height: auto !important;
}
selector .swiper-wrapper {
transform: none !important;
flex-wrap: wrap;
display: grid;
grid-template-columns: repeat(var(--et-swiper-grid-cols, 4), 1fr);
grid-gap: 30px !important;
}
selector .swiper-wrapper .swiper-slide {
margin: 0 !important;
width: auto !important;
}
[data-elementor-device-mode="tablet"] selector {
--et-swiper-grid-cols: 3;
}
[data-elementor-device-mode="mobile"] selector {
--et-swiper-grid-cols: 2;
}
Frontend result: https://prnt.sc/Rm40ClYQlq5w
Best regards,
Jack Richardson
The 8Theme Team
When I change the display setting of the category template to all instead of a specific category
There is no showing of products it is stuck on the category page.
template:
https://garagedoorshark.com/wp-admin/post.php?post=8082&action=elementor
What to do?
Hello @shahar klamka,
Since the widget for displaying products has not been added, it is logical that such content will not be shown.
We have already provided a comprehensive answer to a similar question, which you can review along with the attached screenshots for additional information: https://www.8theme.com/topic/when-using-category-template-on-all-product-categories-it-never-shows-products/#post-461390.
If you would like to display products only on subcategory pages, it appears that a custom solution will be required—either on the PHP side using hooks or filters, or through custom CSS. Our suggestions are as follows:
1. Add the Archive Products widget in the builder template.
2. Create a CSS solution to hide this widget on all product archive pages and display it only on subcategory archives, or develop a PHP solution to prevent the Archive Products widget content from appearing on pages that are not subcategories (in other words, categories that do not contain nested categories).
We would like to hear your thought about such solution, so we will try to do our best to help you in such request.
Best regards,
Jack Richardson
8Theme Team
You must be logged in to reply to this topic.Log in/Sign up