# PAID - Request - add CSS class containing tag group

**URL:** https://meta.discourse.org/t/paid-request-add-css-class-containing-tag-group/313056
**Category:** Marketplace
**Created:** [June 21, 2024, 1:23pm UTC](https://meta.discourse.org/t/paid-request-add-css-class-containing-tag-group/313056 "2024-06-21T13:23:21Z")
**Posts on this page:** 7
**Page:** 1

<div class="post-metadata">

### Author: ![jrgong](https://avatars.discourse-cdn.com/v4/letter/j/c57346/32.png) [@jrgong](https://meta.discourse.org/u/jrgong)
#### Post date: [June 21, 2024, 1:23pm UTC](https://meta.discourse.org/t/paid-request-add-css-class-containing-tag-group/313056/1 "2024-06-21T13:23:21Z")

</div>

Update: Adjust the specs to rather use group IDs instead of group names as we often rename those.

See feature request topic here for reference: [Add CSS class containing tag group - #7 by loginerror](https://meta.discourse.org/t/request-add-css-class-containing-tag-group/68492/7)

Basically we need tag group CSS classes to be added to each tag so we can hide specific tags and adjust the order the tags are displayed in.

## Example:

Tag name; `indoor`  
tag group IDs which the tag is placed in: `1`, `12`

Current html output:

```plaintext
<a href="/tag/indoor" data-tag-name="indoor" class="discourse-tag box">...

```

Desired html output:

```plaintext
<a href="/tag/indoor" data-tag-group="location" data-tag-name="indoor" class="discourse-tag box tag-group-1 tag-group-12">...

```

---

<div class="post-metadata">

### Author: ![jrgong](https://avatars.discourse-cdn.com/v4/letter/j/c57346/32.png) [@jrgong](https://meta.discourse.org/u/jrgong)
#### Post date: [June 23, 2024, 11:46am UTC](https://meta.discourse.org/t/paid-request-add-css-class-containing-tag-group/313056/2 "2024-06-23T11:46:44Z")

</div>

Updated the requirements to use tag group IDs instead of names since we often rename those

---

<div class="post-metadata">

### Author: ![manuel](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/manuel/32/468169_2.png) [@manuel](https://meta.discourse.org/u/manuel)
#### Post date: [June 23, 2024, 4:05pm UTC](https://meta.discourse.org/t/paid-request-add-css-class-containing-tag-group/313056/3 "2024-06-23T16:05:17Z")

</div>

I wouldn’t know how to implement it properly, but would love to see someone pick it up 🙂 For reference I had posted a feature request here as well: [Add a data-tag-group attribute for tags](https://meta.discourse.org/t/add-a-data-tag-group-attribute-for-tags/234410)

As mentioned there I believe the technical implementation would be more aligned with Discourse defaults if it wouldn’t be assigned a class but a data attribute as classes are usually applied for common styles, not for unique identifiers. Also, tags already have the data-tag-name attribute, so a data-tag-group attribute seems to fit right in.

For styling in CSS, there’s no advantage to have a class. It’s just as straightforward to declare styles based on the attribute (`[data-tag-group: "group-name"]`).

> [@jrgong](#):
>
> Updated the requirements to use tag group IDs instead of names since we often rename those

With respect to the id, I believe it’s actually the same as the name. See [https://meta.discourse.org/tags.json](https://meta.discourse.org/tags.json)

---

<div class="post-metadata">

### Author: ![RGJ](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/rgj/32/523185_2.png) [@RGJ](https://meta.discourse.org/u/RGJ)
#### Post date: [June 23, 2024, 4:06pm UTC](https://meta.discourse.org/t/paid-request-add-css-class-containing-tag-group/313056/4 "2024-06-23T16:06:43Z")

</div>

> [@manuel](#):
>
> With respect to the id, I believe it’s actually the same as the name

For a tag yes, for a tag group no

 ![image](https://global.discourse-cdn.com/meta/original/4X/d/c/7/dc7d8fc61bc93672026b5f182d626e991c78deec.png)

---

<div class="post-metadata">

### Author: ![manuel](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/manuel/32/468169_2.png) [@manuel](https://meta.discourse.org/u/manuel)
#### Post date: [June 23, 2024, 4:16pm UTC](https://meta.discourse.org/t/paid-request-add-css-class-containing-tag-group/313056/5 "2024-06-23T16:16:27Z")

</div>

Thank you @RGJ !

Also, don’t want to hijack your marketplace topic @jrgong, so please flag or move to my feature request if you think it is!

But I’d still believe if this is also to be generally adopted, it would be both more descriptive and aligned with common attribute naming to use the actual name. So on the tag element it would look like:

```plaintext
data-tag-name="how-to" data-tag-group="documentation"

```

rather than:

```plaintext
data-tag-name="how-to" data-tag-group="17"

```

---

<div class="post-metadata">

### Author: ![jrgong](https://avatars.discourse-cdn.com/v4/letter/j/c57346/32.png) [@jrgong](https://meta.discourse.org/u/jrgong)
#### Post date: [June 23, 2024, 4:20pm UTC](https://meta.discourse.org/t/paid-request-add-css-class-containing-tag-group/313056/6 "2024-06-23T16:20:54Z")

</div>

Totally agree with that! Thx for the input ❤  
My idea is to make it accessible for the whole community.

---

<div class="post-metadata">

### Author: ![system](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/system/32/443519_2.png) [@system](https://meta.discourse.org/u/system)
#### Post date: [July 23, 2024, 4:21pm UTC](https://meta.discourse.org/t/paid-request-add-css-class-containing-tag-group/313056/7 "2024-07-23T16:21:53Z")

</div>

This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.
