Order tags by tag group

Support

AI-generated summary

The discussion revolves around ordering tags by their tag group in Discourse topics. nexo wants to order tags from “Verified” to “Other Tags” but currently, tags are ordered based on the selection order when creating a topic. awesomerobot suggests adding a data-tag-group attribute to designate the tag group, which could then be targeted with CSS. loginerror asks for a CSS solution to target tags by name and mentions the limitations of using float: left. renato provides a CSS solution using the order property to prioritize specific tags, such as .discourse-tags .discourse-tag[data-tag-name=yourtag] { order: -1; }.

1

Hi,

How can multiple tags in a topic be ordered? I have two tag groups: “Verified” and “Other Tags”. Can I order them from verified to other in topics?

image
image543×272 24.4 KB

I’d like it to be ordered like the 2nd topic in the picture. Right now tags are ordered by the order the user selects them when creating a topic.

2

It’s not possible because we don’t add any classes or attributes to designate which tag-group a tag belongs to.

We already have data-tag-name='example-tag'… it might also be useful to have data-tag-group='example-group'if a tag is in a group (I’m not sure how difficult that change would be though). Then you’d be able to target tag groups with CSS.

3

@awesomerobot

What would be the best way to achieve that with CSS, when targeting tags by name?

We used the simple float: left, but it breaks the alignment of the pushed tag and requires awkward pixel management in different places to have it aligned.

4

I was able to change the order for specific tags that I needed to appear first like this:

.discourse-tags .discourse-tag[data-tag-name=yourtag] {
    order: -1;
}