Hide child categories –

Hi,

This might be possible with CSS. On the Category module, check “Show category hierachy”. Then on the frontend, hide nested categories with CSS display:none, when the parent category is checked, then show nested categories with display:block.

Hi,
Thanks a lot for your help. I tried several time in different ways without success. Maybe I don’t see how to put CSS display:none and display:block. We can’t add CSS in module directly.

Do you have more informations ?

Thanks again,

Can you post the URL where you have the product filters? Remember to enable the “Show category hierachy”. We will provide the custom CSS code.

Hi,

Thanks for you help again.

The URL is : https://www.soleilconceptstore.com/shop/

The “Show category hierarchy” is enable.

If you need more info, I’m here !

Thanks again,

Théodric

Try to add the following custom CSS:

.wpf_items_wrapper .wpf_item .wpf_submenu ul {
display:none;
}
.wpf_items_wrapper .wpf_item .wpf_submenu input[type=”checkbox”]:checked + label + .wpf_submenu {
display:block;
}

Hi there!

Thank you a lot for your answer, it worked !!

Just last question, my categories show in a horizontal way while I would like to see categories in a vertical way.

Actual category disposition : 1 – 2 – 3

Category disposition wanted :
1
2
3

Do you think that you can help me again with that ? I tried to modify the layout in the plug-in, in the “CATEGORY” like Vertical, but it doesn’t work..

Thanks again for your help !

Théo

Hi, it’s me again.

Sorry, I have an other question about the categories.

Can I hide child categories with your CSS in some pages and show child categories in others different pages ? Is something possible ?

Thank you a lot for your help.

Théo

1) You can select vertical option here: https://share.getcloudapp.com/WnuGEzpv

2) Yes, you can target the page-ID body class, so it won’t affect all pages.

Hi there !

Thank you for your reply !

1) I already tried several times without any success, on different filters, it doesn’t work. The layout doesn’t change whatever I do.

2) Ok thanks you a lot it works !

Do you have an idea how I can resolved this issue for the 1) ?

Hi,

For the 2). I tried for some pages, but something strange appeared, when I click on one parent category, the child categories doesn’t”t show up. Same thing when I put the CSS in general for all pages. It doesn’t work anymore… The child categories are hide, but doesn’t appeared after…

I have also sub-sub categories, is it possible to hide just the last sub-category ?

Thank you a lot, sorry for all my questions.

Théo

For #1, can you post a screenshot of your product filter option settings (the one that you have selected vertical). On the frontend, it doesn’t seem to have vertical selected.

For #2, please give the URL where you want to hide the last sub-category only. We can assess and provide the custom CSS.

Hi ! Thank you for your reply,

For 1, how I can post a screenshot in this discussion? I didn’t find the tool to send a picture..

For 2, the link is here : https://www.soleilconceptstore.com/collection-solaire/

I checked, the filter is well with vertical options, the parents seems to be vertical but the child categories not…

For another link : https://www.soleilconceptstore.com/collection-solaire/
In this page, I would like to hide just sub-child categories, which is after “Marques”, “Propriétés”, “Texture”, is it possible?

Thank you again for your help,

Théo

You can upload screenshots here and draw arrows on them: https://snipboard.io

Hi team,

Thank you for your reply.

For my vertical option, you can check this screenshot : https://snipboard.io/zYct8x.jpg
This product filter is link to this page : https://www.soleilconceptstore.com/collection-solaire/
and as I said, vertical option is enable but seems to doesn’t work for child categories…

For my second question, I took a screenshot also to hide just certain category if it’s possible : https://snipboard.io/8mvrjw.jpg

Thank you again,

Théo

Hi,

We have created a code to make it look like this: https://share.getcloudapp.com/GGukQld6. If it is ok for you, please add the following custom CSS:

.wpf_items_wrapper.wpf_layout_vertical .wpf_item li{
display: block;
margin-bottom: .8em;
}
.wpf_items_wrapper .wpf_item .wpf_submenu .wpf_submenu ul{
display:none;
}
.wpf_items_wrapper .wpf_item .wpf_submenu input[type=”checkbox”]:checked + label + .wpf_submenu{
display:block;
}