Show topic count in category list

Support
1

Currently the forum shows the number of posts per month. Is there a way to always show the total number of topics?
I saw this post which seems to ask exactly what I’m looking for, but it looks like there is no answer:

3 Likes
2

It isn’t shown anywhere in the UI but if you need to know the numbers, you can try this Data Explorer query:

1 Like
3

Hello,

  1. I wanna show topic count in category navigation.
    But some categories do not show topic count.I went to the category configuration but I don’t see any setting that says I need to enable it.
  2. Also in the sidebar navigation area, can we show topic count for each category?

image
image632×595 61.4 KB

4

There is a user setting Show a count of the new items

https://meta.discourse.org/my/preferences/navigation-menu

You can change the default with the default sidebar show count of new items admin setting. When you change that, you can choose to change it also for existing users.

5

Thanks but what I mean is to show total topics in a category.
Total topics of parent category, child category displayed on dropdown navigation menu.

6 
<script type="text/x-handlebars" data-template-name="components/parent-category-row">
  <!-- ... -->
  <td class="topics">
    Topics: ({{this.category.totalTopicCount}})
  </td>

  <td class="replies">
    Replies: ({{this.category.totalReplyCount}})
  </td>

  <!-- ... -->
</script>

I believe something like this should work.

7

How can i run this code?
Create Theme component?

image
image2274×1424 248 KB

8

Hi, sorry I missed this. Try this one for CSS.

To create a CSS that shows the topic count in the subcategory on Discourse, you’ll need to target the specific elements in the Discourse DOM that represent the count of topics for a subcategory. Below is a CSS example that you can apply via the admin interface in Discourse.

  1. Navigate to the Admin Customize Section:

    • Go to Admin > Customize > Themes.
    • Select an existing theme or create a new one.
    • Click on Edit CSS/HTML.

  2. Add Custom CSS:

    • Within the CSS tab, add your custom styles. For example:
/* Custom CSS to show topic count in subcategory */
.subcategory {
    position: relative;
    padding-right: 40px; /* Adjust as needed for spacing */
}

.subcategory .subcategory-details .topics {
    font-size: 0.8em; /* Makes the topic count slightly smaller */
    color: #666; /* Use a color that matches your theme */
    position: absolute;
    top: 50%;
    right: 10px; /* Place it on the right of the subcategory */
    transform: translateY(-50%);
    background: #f2f2f2; /* Background color to make it stand out */
    padding: 2px 5px;
    border-radius: 3px; /* Rounded corners for a better look */
}

.subcategory:hover .subcategory-details .topics {
    background: #ddd; /* Change background color on hover, if desired */
}
  1. Save the Changes:
    • Click on the Save button to apply the custom CSS.

The CSS above assumes the existing structure of subcategories in Discourse. You might need to inspect the HTML structure using browser developer tools (right-click and Inspect in most browsers) and modify the CSS selectors accordingly based on the actual DOM structure of your Discourse setup.

In Discourse, subcategories typically have the class .subcategory and topic counts might be inside certain element structures that you can target with more specific CSS if necessary. Ensure that elements like .topics, .subcategory-details, and their hierarchical structures match what is in your platform for accurate styling.

1 Like
9

Thank you very much for your support, but it not effect

image
image684×1006 123 KB

image
image1560×1306 282 KB