Nested Categories (child inside parent's categories) in JetSmartFilters using Checkboxes... Like this...

[eybel]

I am requesting this feature since I use SmartFilters but it doesnt have nested categories. if you have plenty and/or quite a few child categories, the list gets long.... FacetWP Plugin has it and that is why I have to keep renewing their license.

This feature will come in handy... NESTED categories.

### Filter by Category

1) Parent A (40) [ - ] Child A (20) Child B (10) Child C (10) 2) Parent B (20) [ + ] 3) Parent C (35) [ + ]

Thank you.

[rubendevalle]

Please

[numanagit]

+1 This is an urgent feature, otherwise smart filters will work only for small stores. Makes no sense. Please, when you implement this, make sure of the lazy load of the subcategories. I'm seeing the plugin loads every filter! Even when you enable the indexing. The plugin is hidding the empty tax with CSS!!!

Hope you can resolve this soon. Thanks

[numanagit]

Is this going to be implemented? Plugin is useless with bit amount of taxonomies.

[nicpie]

Another one for nested child categories. I want to use this plugin but the long list of categories is unuseable.

[MathiasVignes]

Really need this..

[julianderyk]

+1

[Ayey]

+1

[monchitoabdala]

+1 Has anyone found a solution?

[carlton-riffel]

Another Vote. Seems like an important feature.

[metmu]

Another Vote

[Cosirax]

This feature is really needed. Please consider to add this asap! Thanks 👍

[NLGLORY]

Someone has solution ???

[NLGLORY]

Is it possible that someone can code it ? I really need this. And there is not really a other option for a car marketplace website.

[Vossha]

+1

[carlton-riffel]

I was able to do it with the following code added in an HTML block above my filter - hope this helps.

`

`

[Manzazuuu]

+1

[morosmo]

+1

[RonR-WebDesign]

This is awesome carlton-riffel... can I ask for one minor tweak. How do I close the first (all other) children when clicking another parent?

[carlton-riffel]

Not entirely sure without playing with it for a while. Here is a link to the original that I tweaked slightly. https://element.how/crocoblock-jetsmartfilters-toggle/ there are more tweaks in the comments

[Damian92kr]

@carlton-riffel This is great, I would like to ask if it is possible to modify the code so that after entering a subcategory (but not through a filter, for example, the main menu), the parent of a given subcategory is expanded so that the user knows where it is. At this point, the filter is collapsed and the user does not know where it is.

[carlton-riffel]

@Damian92kr Im not sure what you mean. How is your menu connected to your filter? Im interested to hear your settings.

I know enough scripting to be dangerous, but dont honestly am not that proficient as I think most of that is processed server side. I would check the comments on the original post. https://element.how/crocoblock-jetsmartfilters-toggle/ t

[Damian92kr]

@carlton-riffel it's not about merging the menu. For example, you are on the zalando website, you go through the menu on the home page to the Women-> category Clothing->Coats. There is a filter on the left side of the screen. The filter is expanded so that you can see the Women-Cloathing - Coats category tree. For me, this tree is curled up

[Damian92kr]

@carlton-riffel I mean when the user is somewhere deep in the subcategory A->B->C->D-> he saw the whole path where exactly he is. In order for the tree from parent to child to be developed, at this point he must expand the filter manually by clicking first A, then B etc. At this point, Slideup is applied to the tree until the user expands it himself.

[natequreshi]

I created some taxonomies with icon, there is no functionality in JetSmartFilter to show icon/image for select dropdown filter, is it possible through something, as I created using JetEngine, I am sure somebody can answer How I can show Icon in select filter of each taxonomy

[Emilracerbil]

This would be a really useful feature!

I tried your code @carlton-riffel, but the whole filter seems to collapse when loading the page. I.e not just the child categories, but the parent categories too leaving nothing left to see/click. Did you not have this problem or am i doing something weird?

[nu-ad]

This deserves a bump! How is Group terms by parents not a thing for select-type filter? @Crocoblock you guys need to revisit this suggestion and actually add it since it's a basic functionality of said filters for categories and sub-categories. I've just spent some time researching this function in JSF just to learn it is not possible...

[numanagit]

3 years receiving these notifications. I remember when I face this issue i ended up developing the complete solution using vanilla JS and ajax on Wordpress. Totally waste of time after purchasing the plugin to save some. Of course I did not use Crockoblock anymore after that. So basic and important functionality for any dynamic data managing. Hope they don't keep using the "load more" with CSS...

[Emilracerbil]

@SargasTM @Floydtm @Crocoblock is this something that is in the pipeline seeing it's been pending since 2020?

[itthikorn-o]

Try this.

Script

<script type="text/javascript">

jQuery(function ($) {   
$(document).ready(function(){

    $(".jet-list-tree__children").hide(); 

    $(".caret-down-custom").click(function(){
    $(".jet-list-tree__children").hide('slow'); 
        $(this).parent().next(".jet-list-tree__children").toggle('slow'); 
    });
  });
});
</script>

jet-smart-filters>templates>filters>checkboxes-item.php or child-theme>jet-smart-filters>filters>checkboxes-item.php

<?php
/**
 * Checkbox list item template
 */

$checked_icon = apply_filters( 'jet-smart-filters/templates/checkboxes-item/checked-icon', 'fa fa-check' );

?>
<div class="jet-checkboxes-list__row jet-filter-row<?php echo $extra_classes; ?>">
    <label class="jet-checkboxes-list__item" <?php echo jet_smart_filters()->data->get_tabindex_attr(); ?>>
        <input
            type="checkbox"
            class="jet-checkboxes-list__input"
            name="<?php echo $query_var; ?>"
            value="<?php echo $value; ?>"
            data-label="<?php echo $label; ?>"
            aria-label="<?php echo $label; ?>"
            <?php echo $checked; ?>
        >
        <div class="jet-checkboxes-list__button">
            <?php if ( $show_decorator ) : ?>
                <span class="jet-checkboxes-list__decorator"><i class="jet-checkboxes-list__checked-icon <?php echo $checked_icon ?>"></i></span>
            <?php endif; ?>
            <span class="jet-checkboxes-list__label"><?php echo $label; ?></span>
            <?php do_action('jet-smart-filter/templates/counter', $args ); ?>
        </div>
    </label>
    <div class="caret-down-custom"><i class="fa fa-caret-down" aria-hidden="true"></i></div>
</div>

CSS

<style>

div.jet-list-tree__children > div.caret-down-custom{
    display: none !important;
}

.caret-down-custom{
    display: inline  !important;
    margin-left: 19px;
    vertical-align: middle !important;
}
</style>