Adding Hierarchical Styling

Hi Deb,

There’s already a “hierarchy” by css classes you can use to create your own styling if that’s what you’re looking for.

You can target the different levels by classes like “level-0”, “level-1” etc.

Thanks for your reply. Would I add that to the custom CSS styling box? I’m not very strong in the areas of coding and CSS.
Thanks,
Deb

No problem,

You can either add it to the custom CSS styling box or in your themes style.css.
Like:

.select2-results li.level-0{
color: red;
}

Thanks for example! My problem really has to do with the fact that my hierarchical taxonomy is displaying as a flat list. All I need is the proper indentations, and that’s not happening.

Okay, if you’re using select2 for the dropdowns in the filter they should have a “–” before the term names if they are child terms. Otherwise you can add something like a padding to the level-1 elements.

.select2-results li.level-1{ padding-left:10px; }

Unfortunately, that line has no effect on the drop down display. I added a dash to the category name, and that does help distinguish the child categories, but the category looks strange when it’s displayed elsewhere on the site. I must be doing something incorrectly.
I do appreciate all your help!
Thanks,
Deb

Jonathan –

I figured it out. I added the extra code into to my Functions.php file and now it works. Thanks so much for your help! I love your plugin!
Deb

Hi Deb,

Glad you worked it out!
If you enjoy the plugin please feel free to leave a review, it helps to keep me motivated ??

Best of luck in your project!