When in a category, default to "none" rather than "all" subcategories

I’d like to find a way to default the view for all users to display “none” rather than “all” subcategories, when in a category. “all” would be an option they could select. Is there any way to achieve this?

Generally, my community is finding “none” as an option to select unintuitive.

10 Likes

I think you are looking for the checkbox to limit display of subcategories within a category; this already exists.

No - that’s totally different. When you display subcategories it looks more like a categories page. I like the list of topics, but just want to see the list of topics for the category (none), not for the category plus subcategories (all).

6 Likes

Fixed it via JS. You have to add this code to your head.

// For categories list
$(document).on('mouseover', 'td.category div.pull-left a', function() {
    // do it only once
    if ($(this).hasClass('link-fixed')) {
        return;
    }
    
    // do it only if there's subcategories
    if ($(this).parents('td.category').find('div.subcategories').length) {
        var link = $(this).prop('href');
        $(this).prop('href', link+'/none');
    }
    
    $(this).addClass('link-fixed');
});

// For dropdowns
$(document).on('click', 'ol.category-breadcrumb li', function() {
    // do it only once
    if ($(this).hasClass('links-fixed')) {
        return;
    }
    
    // do it only for first dropdown
    $(this).addClass('list-clicked');
    if (!$('ol.category-breadcrumb li').slice(0, 1).hasClass('list-clicked')) {
        $(this).removeClass('list-clicked');
        return;
    }
    $(this).removeClass('list-clicked');
    
    // you can't check subcategories from here, so doing it for all
    $(this).find('section.category-dropdown-menu div.cat a').each(function() {
        if (!$(this).hasClass('home')) {
            var link = $(this).prop('href');
            $(this).prop('href', link+'/none');
        }
    });
    
    $(this).addClass('links-fixed');
});

// For breadcrumbs when reading a topic
$(document).on('mouseover', '.title-wrapper .ember-view a', function() {
    // do it only once
    if ($(this).hasClass('link-fixed')) {
        return;
    }
    
    // do it only for first button
    $(this).addClass('list-clicked');
    if (!$('.title-wrapper .ember-view a').slice(0, 1).hasClass('list-clicked')) {
        $(this).removeClass('list-clicked');
        return;
    }
    $(this).removeClass('list-clicked');
    
    var link = $(this).prop('href');
    $(this).prop('href', link+'/none');
    
    $(this).addClass('link-fixed');
});

I don’t think this will work on phones. There’s probably no such events as “mouseover”.

5 Likes

Wanted to say thanks for the JS fix Maestra, and make a small contribution:

The above JS works 99% of the time, but a user found that when they clicked on the little unread notification in the categories list, it took them to a page that doesn’t exist. E.g., for meta.discourse.org they’d end up here: https://meta.discourse.org/c/feature/l/unread/none.

The minor edit I used to fix this is to slap the following at the top of your first section of code for the categories list, right after the if: ‘link-fixed’ bit.

var ignore = /(unread|new|top)/
//ignore unread, new, top links
if(ignore.test(this.getAttribute('href'))){
    return;
}

The ‘top’ part might not be necessary in retrospect, but whatever it doesn’t hurt anything.

edit - I suppose more sophisticated regex might be in order if one of your categories has “new”, “unread”, or “top” in the name, though.

For me the first part for the category list did not work. so here is my solution.

 $(document).ready(function() {
        // do it only once
        $('td.category .ember-view a').each(function() {
            if ($(this).hasClass('link-fixed')) {
                return;
            }
            // do it only if there's subcategories
            if ($(this).parents('td.category').find('div.subcategories').length) {
                var link = $(this).prop('href');
                $(this).prop('href', link+'/none');
            }
            
            $(this).addClass('link-fixed');
        });
        
    });
4 Likes

Hi

I am having some issues with this… I added the js to my head section but apparently it breaks if you click on the logo to get back to the home page.

Step to reproduce:

  • go to the discourse website
  • select a category with subcategories -> it works, defaults to “none”
  • click on the discourse logo (upper left) and go back to the home
  • select a category with subcategories -> it doesn’t works, defaults to “all”

Any idea why ?

Is it so hard to make second’s dropdown list value configurable?

I’d love to see this as a built-in feature too.

We’re using subcategories for discussions in different languages (one for English, one for Spanish etc.) so seeing a list of discussions in different languages on the parent category page is a bit confusing for people.

It would be really useful to be able to have ‘None’ as the default view for the category page (as in screenshot below) instead of ‘all in [category name]’

Are there plans to implement this?

3 Likes

I just had to modify some code.

https://github.com/discourse/discourse/blob/2d031a1beb206416f39601df224d192cf0907736/lib/topic_query.rb#L631

Just make this line execute uncoditionally.

1 Like

Thanks Artur, glad you found a simple solution!

We’re on a hosted instance of Discourse, so unfortunately don’t have access to the source code. We’ll keep using the Javascript workarounds from above; they’re great, but we haven’t found a way to solve the issue described by Cataldo.

Unfortunately, the proposed solution does not work for us. :frowning_face: We are waiting for the built-in function.


Is this not possible with the option link to the section? Unfortunately I did not succeed.

Yeah would also love for this to be a built in option, will make it work more like forums in the past.

Just checking in to see whether this is still being considered or off the table altogether…

Would be great to have an update on this, it would make life so much easier for people who are not so Discourse savvy (new users to forums)

3 Likes

There’s a setting for this on a per-category basis.

Head over to the category page. For example…

https://meta.discourse.org/c/support/6

then click on the wrench icon here

This takes you to the settings for that specific category. From there, click here.

and scroll down a bit until you see this setting

change that to “no subcategories” like so

And that will give you the desired result for that category - the topic list for that category will only show topics in the parent category and will ignore topics in subcategories.

If you want other category pages to have the same behavior, repeat the process for those categories. Like I mentioned above. This is a per-category setting.

7 Likes