function make_categories_selector_collapsable() { ?> <script> jQuery(document).ready(function() { // first we need to hide the children to only see the top level categories jQuery('#categorychecklist ul.children').css('display','none'); // This removes the label functionality as when we click the category name we do not necessarily want to select the item's checkbox, just want to expand the list jQuery('#categorychecklist label').each(function() { var labelHtml = jQuery(this).html(); jQuery(this).replaceWith(labelHtml); }); // we now want to grab each of the >li<'s so that we can use a click function jQuery('#categorychecklist li').each(function() { jQuery(this).click(function() { // so when the item is clicked it shows the sub categories jQuery(this).children().show(); }); }); }); </script> <? } add_action( 'admin_head' , 'make_categories_selector_collapsable' );
Collapsable Categories in Post Editor
So you have a ton of categories and there are a lot of child categories and the list in the post editor has become unruly? In order to change a posts' category or to add it to a new one the list is unmanageable. Here is a jQuery code snippet that you can use to make the categories collapsable. It removes the label functionality. You cannot click on the name to select the item's checkbox, but it now allows you to click on the name to expand the categories. You could definitely put this script into a js file and then enqueue it, but for the purposes of this demo, this works ok too. Here is a demo video: Â [embed width="425" height="349"]http://www.youtube.com/watch?v=TKMoOrQ-rQI[/embed]