form and substance of communication

June 19th, 2010

mootools: collapsing categories & archives

Among dozens of WordPress plugins involving content indexing, Collapsing Archives and Collapsing Categories by Rob Felty are able to manage hierarchy and nesting better than any other.

Since the effects and some of the script core depend on the jQuery framework, I had been missing a corresponding MooTools plugin not involving page overloads. Even the SuperSlider-Menu seems to me too invasive.

When editing the PHP code of the plugins in order to match the MooTools Slider, I’ve been hardly inspired by the neat and solid script provided byShawn Milker. Most of the widget features of the jQuery counterparts have been preserved, including cookies. Now, the remaining page and link plugins of the same series might be converted as well.

MooTools 1.11 versions:

MooTools 1.2.5 versions:

In the WordPress official plugin directory, with docs, changelog and version archive:
Moo Collapsing Archives
Moo Collapsing Categories


  1. Michael 1 Dec 2010 Reply


    I love your collapsing category plugin, however, it is auto expanding one of my categories and I have “none” selected to auto expand.


    • 3dolab 2 Dec 2010

      Hello, thanks for your appreciation!
      If you’re using the latest version of the plugin, check under “advanced options” in the widget admin panel whether it is set to “expand categories assigned to a particular post on a single post page” (or please send me a link to an example page). I hope to have been helpful.

  2. Hi. Nice plugin for WP, but… Do you see how it works in IE 7?

    • 3dolab 7 Dec 2010

      If you mean that squares are displayed instead of arrows, I know… sorry but it started as a conversion of the jQuery plugin made by Rob Felty, so almost every flaw has been replicated. I spent several hours tweaking how IE renders Unicode HTML entities and I found some reference, at last:
      Unicode Characters in the Geometric Shapes Block
      Test for Unicode support in Web browsers

      Now, if you feel confident you can replace, in the plugin options.txt, collapscat/collapsarch.php and *list.php, any unsupported occurrences with #9658 (black right-pointing pointer) and #9660 (black down-pointing triangle).
      However, I plan to permanently solve the problem in the next update of the plugin.

  3. How do I prevent the archives from automatically opening the current year? On a page load I want all the archives to be closed by default.

    • 3dolab 21 Dec 2010

      Hmmm I guess you could tweak the widget settings:
      Leave Current Year Expanded by Default / Leave Current Month Expanded by Default

  4. Since January 1st I’ve had issues with the archives overwhelming the rest of my sidebar content and removing it completely. At the same time it also doesn’t seem to want to show anything in 2010. Is there a fix coming out for this or are there some settings I need to tweak?

    • 3dolab 3 Jan 2011

      install the brand new 0.5.3 version where the “new year bug” is fixed

      or try to edit collapsarchlist.php and change
      if($i>=2 && $allPosts[$i-2]->year != $archPost->year ) {
      if($i>=1 && $allPosts[$i-1]->year != $archPost->year ) {

  5. Hi,

    I find your plugin to a great use but the problem is that when the website supports multilingual/WPML, all categories including all languages are displayed. How can we limit the categories and posts per language?

    I found the query lies in collapscatlist.php –

    $catquery = "SELECT t.*, tt.* FROM $wpdb->terms AS t INNER JOIN
    $wpdb->term_taxonomy AS tt ON t.term_id = tt.term_id WHERE tt.taxonomy IN
    ($catTagQuery) $inExcludeQuery AND t.slug!='blogroll'
    $catSortColumn $catSortOrder ";

    But I am not able to join the wp_icl_translations table. Please help.


    • 3dolab 5 Jan 2011

      Hello Demis, you’re right: the plugin category custom query resides in collapscatlist.php, but I think the job is not as straightforward as simply joining two tables.

      Unfortunately, at the moment I’m using the qTranslate plugin for multilingual support: even if WPML seems much better and much more complete in handling translated content, since it’s stored in a separate table, I’m not accustomed to its structure.

      However, after a first look to the documentation, I see that WPML assigns and retrieves different IDs to translated content, so I bet you first have to check the current (active) language, then query the icl_translations table by element_type and list categories accordingly, by the ID and not the slug or term name.

      By the way, the main WPML file sitepress.class.php contains an useful function parse_query($q) so maybe you could simply edit collapscatlist.php by hand to ensure that it’s loaded and then use it to filter the query.

      I know, it could be done automagically if only the WP API was used in the collapsing plugin instead of a direct access to the database.
      This applies to the original Collapsing Categories Plugin as well, but hey… that’s the deal!

      Keep us updated about any progress

  6. zampai 4 Jan 2011 Reply

    Nice list of categories and posts but not working with WP 3.0.3..

    -> No collapsing effect. Everything is expanded.
    -> No css modification via admin

  7. This is a great widget! Thank you so much for putting this together.

    I’ve noticed that post titles that include characters: ” or ‘ show up oddly in the lists on the page (i.e. ‘ shows as ' – Children’s becomes Children's).

    Do you happen to have any thought on how to get it to display those characters properly

    Thanks again for this!

  8. 3dolab 7 Jan 2011 Reply

    @ zampai:
    I’ve just successfully tested both the plugins with WP 3.0.3, it seems you’re experiencing a conflict with other extensions, that probably resides in JavaScript. Do you have activated any stuff recently?
    Can you please provide more detail, the source code or an example link?
    Feel free to send me a private message.

    @ Brad:
    After a first look, I guess your troubles with apostrophes, primes and quotation marks are caused by WP sanitize or texturize filters in your theme’s functions. Is that a problem only limited to the collapsing plugins?
    By the way, check WordPress support topics and let me know

  9. Pavel Krasnovskij 14 Feb 2011 Reply

    about wpml/collapsing cat combined:

    changing query to

    $catquery = “SELECT t.*, tt.* FROM $wpdb->terms AS t INNER JOIN
    $wpdb->term_taxonomy AS tt ON t.term_id = tt.term_id join wp_icl_translations wi on wi.element_id=t.term_id and wi.element_type=’tax_category’ and wi.language_code='”.ICL_LANGUAGE_CODE.”‘ WHERE tt.taxonomy IN
    ($catTagQuery) $inExcludeQuery AND t.slug!=’blogroll’
    $catSortColumn $catSortOrder “;

    made it work for me

    • 3dolab 17 Feb 2011

      Thanks A LOT for your precious contribution!
      Now I have no excuses for not finding the time to switch to WPML
      Frankly, I don’t like that much all the code lines thrown in by qTranslate

  10. good plugin! There is some way of being able to add icons to the Collapsing Categories?
    I have the Category Icons Lite plugin installed, and need that the icons are seen in your plugin, some idea?

    • 3dolab 17 Feb 2011

      Hello, I know the Category Icons plugin since I’m using in several sites: it is definitely worth a try.
      I’ve managed to make it work independently for layout consistency and never combined it with Collapsing Categories, but anything is possible if you are accustomed to PHP editing.
      Depending on where the icon should be displayed, I would start inserting in collapscatlist.php:
      function collapsing_icon($cat) {
      if ( class_exists('CategoryIconsLite') ) { //check if Collapsing Icons plugin is activated
      $icon = get_icon($cat->term_id);
      if (!empty($icon)) { //check if icon is assigned
      $image = $this->html_tag($icon,$cat->name);
      return $image;

      and then add $link .= collapsing_icon($cat) beside any occurrence of
      $link .= apply_filters(‘single_cat_title’,$cat->name)
      or $link2 .= collapsing_icon($cat2) everytime
      $link2 .= apply_filters(‘single_cat_title’, $cat2->name) is found.
      It should work.

  11. csoftAdmin 26 Feb 2011 Reply

    I need exactly same but for the Admin panel in Add New Post.

    I want my word-press post be in specific category like Country – State – City. But my list is toooooo big so it causes the loading time so higher.

    I want to modify this category section like.

    On the new post it only shows the country list when I click on the country then it loads the states for that parent country. And when I clicked on the state then it loads the city list.

    I search for the plugin which suits my requirement but I fail If you know any plugin which help me then please recommend me.

    Or give me some suggestion how I make this king of plugin from start.


    • 3dolab 1 Mar 2011

      I got it… your request is clear but not simple:
      first, it’s highly recommended to keep using jQuery, the default JavaScript framework in the Admin backend, instead of switching to MooTools; in other words, you should stick to the first Collapsing Categories plugin (and maybe ask for help in its well populated forum, too).

      Then you could hack the plugin or write your own one by inserting the whole query & output code in order to replace the post_categories_meta_box function and get the “collapsing” behavior in the Admin Add New / Edit Post panel as well. The function is defined in wp-admin/includes/meta-boxes.php.

      You could also check similar topics for further details.
      However, in any case the list won’t load faster since the elements are actually loaded inline and then hidden, Ajax is not involved so you could only put categories in order, according to your display needs, without loading time being affected.

  12. sory for stupid question.

    how to show all categories eventough there is no post?

    I want to show all categories (except sub categories) in my sidebar.


    • 3dolab 6 May 2011

      Try to edit the file collapscatlist.php.
      function getSubPosts, remove line 142, 143, 144:
      if (count($posts)==0) {
      return array(0,'');

      function list_categories, remove !empty($cur_categories) at line 556 and leave only the second condition (in_array…),
      replace ($theCount>0) with ($theCount>=0) at line 593,
      remove ($subCatPostCount>0) or replace it with ($subCatPostCount>=0) at line 659, 666 and 691;

      function get_sub_cat, replace ($subCatCount>0) with ($subCatCount>=0) at line 331 or remove the condition and leave only if ($showPosts)

      as for subcategories, remove continue; at line 237 and 286 from
      if ($subCatPostCount2<1) {

      I didn’t test it but it should work: play around with these lines depending on your needs

  13. Thanks for your quick answer.
    But it doesn’t works.
    I should satisfied with the current settings.

  14. moonshow 19 May 2011 Reply

    Hi, installed the plugin.

    I opted for the manual include and didn’t use the widget. Are there changes in the manual way? the categories come out fine but are always in the expanded for. it does not collapse

    • 3dolab 6 Jun 2011

      It sounds like conflicting javascript: are you running jQuery or any other MooTools based plugin?
      Try to debug by disabling every plugin except this one and then re-activate them one by one.

  15. Way too much javascript.

    • 3dolab 6 Jun 2011

      Do you think so?
      If you found a smarter way, please share it and let us know how to do it.
      If not…

  16. Hi, thanks for a great simple and beautiful plugin!

    my problem is that I can’t disable expand categories assigned to a particular post on a single post page.

    First I tried to disable it thru the widget advanced options, but it always kept checking the box. (yes, I was saving).
    so I edited the – ‘expandCatPost’ => false, and now in the widget options the checkbox is empty, but it still shows in posts!

    any idea that can help me?

    I assign several categories to each post, and expanding them all makes quite a mess…


  17. Hi,
    unfortunately I removed the plugin, because it created quite a mess.
    I really really wish I could use it, being much more elegant that wp original.
    If you would like, I will put it back and run some tests.

    • 3dolab 6 Jun 2011

      Thank you for the notice. I’ve tried to solve the problem you described.
      Now it should work, please try the latest version (0.5.4)

  18. Thanks, it works GREAT!!!

  19. well, everything worked great, until I tried to view it on IE. everything there is pretty mest up. is there any solution?

  20. Hello,

    this plugin works with Firefox but not with IE.

    Take a look:

    Internet Explorer:


    Do you have any idea?

  21. Sorry, upload the wrong image. Here is for Internet Explorer:

  22. @ Yos & Andi, please be more specific: taking for granted that you’re using the latest release of the plugin, which version of Internet Explorer are you running? MSIEs can behave really differently.

    Anyway, it looks more like a CSS thing. The style provided by default is more neutral as possible, but if you played around with margins and paddings in your widget container, you would need to adjust it somewhere.

    Give my site a try and you will notice that almost everything is fine.
    I’m only experiencing some minor problems with IE6.

  23. Hello 3dolab,

    thanks for the fast reply.

    I test the Internet Explorer 8 and the newest Version of the Plugin (Version 0.5.4 ) WordPress-Version is 3.1
    I test all Style-Options from this plugin but same problem.

  24. No idea where the problem is?

    • 3dolab 30 Jun 2011

      Well, this is definitely not the best place to talk about MSIE CSS bugs, however you could try something like

      <!--[if lte IE 8]>
      <style type="text/css">
      .widget-container ul { margin-left: 0; margin-right: 0; }
      .widget-container ul li ul li ul { padding: 0; margin: 0;}
      .widget-container ul li ul li{ padding: 0; margin: 0;}
      .widget-container ul li ul li ul li { padding: 0; margin: 0;}

      in your header.php file or adding it as a function to the wp_head action hook.
      And don’t forget to replace “widget-container” with your actual widget class name!

      I hope this will help

  25. Hello,

    thanks for the fast anwser.

    “And don’t forget to replace “widget-container” with your actual widget class name!”

    What do you mean exactly? Where i found the Class-Name?


    • 3dolab 3 Jul 2011

      Oh, I mean in general the ID or class of the HTML element that holds your widgets, to which the CSS rules are applied. It’s usually named #sidebar but it could be .widget-wrapper or whatever, depending on your theme markup structure.

      It’s also possible to affect only widgets pertaining to the collapsing plugins and disregard the rest.
      In this case, you could replace what I previously mentioned as .widget-container ul li with #widget_collapscat and #widget_collapsarch, or go one step down in the hierarchy and replace .widget-container ul li ul with ul.collapsing.

      For further infos, check:
      W3 schools
      CSS zen garden
      Pocket Reference and CookBook published by O’Reilly
      Explorer Exposed
      IE CSS bugs and IE CSS tricks

  26. the id is “sidebar” (check with firebug). But nothing change 🙁 think i must use another plugin, but thanks a lot for try to help.

  27. You’ve got the best looking collapsing post list widget around. In fact it seems to work fine, and in the plugins world, that’s saying something. Thanks. I do have one question.

    Is there a way I can I turn the mouseover tooltips off?

    You see, I used HTML in my Category Descriptions. It makes a nice looking Category Archive page, but it makes for a funky tooltip.


  28. The bad news is I looked at it in IE8. Sorry…IE hates everything.

    The good news is, tooltip behavior is consistent! 🙂

    • 3dolab 7 Jul 2011

      I’m going to optimize compatibility with IE8 in the next release.
      If you can’t wait, try by putting this in your theme’s header.php file:
      <!--[if lte IE 8]>
      <style type="text/css">
      #sidebar ul.collapsing.categories.list li.collapsing.categories.item {

      or edit accordingly the style set in the plugin options screen.

  29. Hi! I have the problem with sub-categories is displayed with “dubbelname”, for example (at my webbsite) as shown in the following screen-dump; When I use WP built in categories their is no “dubbelnames”. I use the latest version of both the plugin and WP.

  30. Hello! I use Moo Collapsing Archives plugin, it’s great, thank you. Please tell me, how to get collapse post title, when I open link in new tab or browser? Example, when I open link, widget display
    Can plugin display:
    ——post title

  31. How expand link when open in new tab or browser?

  32. Hi,
    what does the catSort option ‘catOrder’ custom order specified in the categorys settings really do. How can I set it? What do you mean by “category settings”. I would like to make a custom order, but I can not seem to find a way. With My Category Order plugin it does not work. Any solutions?
    Thank you for this great plugin. (bow)

    • 3dolab 8 May 2012

      Hello, I had more or less the same troubles in sorting categories with a custom order. Please note that my plugins are just a porting to MooTools of the jQuery version originally developed by Rob Felty. I’ve been using the same “My Category Order” plugin and I managed to eventually accomplish the task *with Collapsing Categories (jQuery)* by adding a few lines to collapscatlist.php.

      “Category order” should be meant to search for an additional “menu order” column in each term, so it would actually work only with menu pages, not category or post_tag taxonomies. I had to struggle with the “get_terms” cached results before being able to effectively get the order set through that other plugin.

      If I’m not wrong, I’ve set the widget to “sort category by slug” and added the following code around line 497 (line 522 in my MooTools version):
      if ( !is_array($taxonomy) ) {
      $single_taxonomy = true;
      $taxonomyarray = array($taxonomy);
      $taxonomyarray = $taxonomy;
      $defaulterm = array('orderby' => 'name', 'order' => 'ASC',
      'hide_empty' => true, 'exclude' => array(), 'exclude_tree' => array(), 'include' => array(),
      'number' => 0, 'fields' => 'all', 'slug' => '', 'parent' => '',
      'hierarchical' => true, 'child_of' => 0, 'get' => '', 'name__like' => '',
      'pad_counts' => false, 'offset' => 0, 'search' => '', 'cache_domain' => 'core' );

      $filter_key = ( has_filter('list_terms_exclusions') ) ? serialize($GLOBALS['wp_filter']['list_terms_exclusions']) : '';
      $key = md5( serialize( $defaulterm ) . serialize( $taxonomyarray ) . $filter_key );
      $last_changed = wp_cache_get('last_changed', 'terms');
      $cache_key = "get_terms:$key:$last_changed";
      wp_cache_delete($cache_key, 'terms');

  33. Hi, I just sent an email, but I thought I would follow up with a comment here too. The default settings have my archive years expanded, and I would like them collapsed. I
    cannot manually collapse the years either. When I hover over the year, I don’t see the text box “collapse years”. Can you tell me where I would edit the code to change this,
    specifically which plugin file and line?


  34. Hi,
    Please let me know how can I remove left black disc of category name ?
    I would like to just only arrow.

    • 3dolab 19 Mar 2013

      check your stylesheet and set the rules for list containers and elements (UL & LI) to list-style-type: none instead of circle or disc: it’s as simple as that

  35. ichihirox 19 Mar 2013 Reply

    Thank you for your advice.
    I will try it.

  36. bhomatude 20 Mar 2013 Reply

    Hello — I’d like to either figure a way to completely collapse the archive list under the widget title ie. “Archives” or somehow add the widget as a sub-menu item under a parent-menu item in the menu. Either way the default look would be just “Archives” until clicked. Any ideas? Thank you.

  37. Soraya 9 Sep 2014 Reply

    Hi, can you update the plugin? Doesn’t work with WP 4.0 . Thanks!

    • 3dolab 11 Sep 2014

      Errr… an update is on the roadmap although not immediately… I didn’t expect that someone could still run MooTools and find these plugin useful 🙂

Leave a Reply

  • development diary