# Check for group membership in Header code?

**URL:** https://meta.discourse.org/t/check-for-group-membership-in-header-code/72642
**Category:** UX
**Created:** [October 23, 2017, 9:03pm UTC](https://meta.discourse.org/t/check-for-group-membership-in-header-code/72642 "2017-10-23T21:03:24Z")
**Posts on this page:** 17
**Page:** 1

<div class="post-metadata">

### Author: ![Gunnar](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/gunnar/32/119647_2.png) [@Gunnar](https://meta.discourse.org/u/Gunnar)
#### Post date: [October 23, 2017, 9:03pm UTC](https://meta.discourse.org/t/check-for-group-membership-in-header-code/72642/1 "2017-10-23T21:03:24Z")

</div>

Hi,

When adding a button or link to the Header field, can I check for group membership and make it conditional?

I.e., if the user doesn’t belong to group ‘group1’, then display the button, otherwise don’t.

Is there a way to do that?

Thanks!  
Gunnar

---

<div class="post-metadata">

### Author: ![cpradio](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/cpradio/32/4970_2.png) [@cpradio](https://meta.discourse.org/u/cpradio)
#### Post date: [October 23, 2017, 9:15pm UTC](https://meta.discourse.org/t/check-for-group-membership-in-header-code/72642/2 "2017-10-23T21:15:37Z")

</div>

The answer is yes, but the amount of work varies.

By calling

```plaintext
var user = Discourse.User.current();

```

You can get access immediately to their `primary_group_name`, but it won’t provide you with all groups they have access to.

To get all groups, you might have to do a call to `/u/username.json` and read the groups property. That makes it a tad more difficult as now you are awaiting the response of a call before you can show the link.

---

<div class="post-metadata">

### Author: ![Gunnar](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/gunnar/32/119647_2.png) [@Gunnar](https://meta.discourse.org/u/Gunnar)
#### Post date: [October 23, 2017, 10:28pm UTC](https://meta.discourse.org/t/check-for-group-membership-in-header-code/72642/3 "2017-10-23T22:28:43Z")

</div>

> [@cpradio](#):
>
> primary\_group\_name

Thanks! In this case it **is** their primary group, so that should make it easier, then. Would you mind helping me out with a snippet of example code, how I would use this? Here’s the code I want to make conditional. If the user is a member of ‘group1’, this button should display, otherwise not:

```
<div id="top-navbar" class="container">
<span id="top-navbar-links" style="display:none;">
<a class="btn btn-lg btn-primary" href="https://www.demo.com/">
<i class="fa fa-flag fa-2x pull-left"></i> Click here<br>for demo!</a>
</span>
</div>

```

Thanks,  
Gunnar

---

<div class="post-metadata">

### Author: ![cpradio](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/cpradio/32/4970_2.png) [@cpradio](https://meta.discourse.org/u/cpradio)
#### Post date: [October 23, 2017, 11:43pm UTC](https://meta.discourse.org/t/check-for-group-membership-in-header-code/72642/4 "2017-10-23T23:43:05Z")

</div>

It sort of depends on where that is being added. Is that a custom header? Or are you trying to add them on the same line as the logo?

If on the same line as the logo, this is close (create it as a custom component and enable it as part of your theme, in the `</head>` section)

```plaintext
<script type="text/discourse-plugin" version="0.2">
api.decorateWidget('home-logo:after', helper => {
        const user = Discourse.User.current();
        if(user.primary_group_name.toLowerCase() === "group1") {
            return helper.h('div#top-navbar.container', [
                    helper.h('span#top-navbar-links', [
                        helper.h('a.btn.btn-lg.btn-primary', {
                            href:'https://www.demo.com/', 
                            text:'<i class="fa fa-flag fa-2x pull-left"></i> Click here<br>for demo!' // not sure if this will work
                        })
                    ])
            ]);
        }
});
</script>

```

---

<div class="post-metadata">

### Author: ![schungx](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/schungx/32/70989_2.png) [@schungx](https://meta.discourse.org/u/schungx)
#### Post date: [October 24, 2017, 4:29am UTC](https://meta.discourse.org/t/check-for-group-membership-in-header-code/72642/5 "2017-10-24T04:29:29Z")

</div>

Actually, it would be nice for Discourse to add group-derived classes to the root body element.

This way makes it very easy to tailor the display according to the user. For example, if I have groups based on counties, I can easily include css that displays the country’s flag as a background.

Or each department can have a different color. And so on. Very very useful.

---

<div class="post-metadata">

### Author: ![vinothkannans](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/vinothkannans/32/86465_2.png) [@vinothkannans](https://meta.discourse.org/u/vinothkannans)
#### Post date: [October 24, 2017, 4:42am UTC](https://meta.discourse.org/t/check-for-group-membership-in-header-code/72642/6 "2017-10-24T04:42:06Z")

</div>

It exist already. For example, If a user’s primary group is `customers` then the body tag will have the CSS class `primary-group-customers`. And it will work only for primary group property.

---

<div class="post-metadata">

### Author: ![schungx](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/schungx/32/70989_2.png) [@schungx](https://meta.discourse.org/u/schungx)
#### Post date: [October 24, 2017, 4:44am UTC](https://meta.discourse.org/t/check-for-group-membership-in-header-code/72642/7 "2017-10-24T04:44:06Z")

</div>

Ah. Great. Didn’t notice this. Next time I’ll check first and bubble later! 😅

---

<div class="post-metadata">

### Author: ![schungx](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/schungx/32/70989_2.png) [@schungx](https://meta.discourse.org/u/schungx)
#### Post date: [October 24, 2017, 4:45am UTC](https://meta.discourse.org/t/check-for-group-membership-in-header-code/72642/8 "2017-10-24T04:45:58Z")

</div>

But it should work for all groups. Just the primary group is very restrictive.

If you have all, I can have elaborate css to decide what format to use based on groups.

EDIT: Many groups are not primary. They are used just to restrict access for categories. Some are use simply for identification purposes, and these groups are primary candidates for formatting purposes. It is very unlikely that the primary group is all you need.

---

<div class="post-metadata">

### Author: ![Gunnar](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/gunnar/32/119647_2.png) [@Gunnar](https://meta.discourse.org/u/Gunnar)
#### Post date: [October 28, 2017, 8:20pm UTC](https://meta.discourse.org/t/check-for-group-membership-in-header-code/72642/9 "2017-10-28T20:20:21Z")

</div>

> [@vinothkannans](#):
>
> If a user’s primary group is customers then the body tag will have the CSS class primary-group-customers.

So, should this work then, if I want to display “Member!” if the user is a member of the “patrons” group?

```
<p id="ghjldemo">Not a member!</p>

<script type="text/javascript">
if ( document.getElementById("body").className.match(/(?:^|\s)primary-group-patrons(?!\S)/) ) {
    document.getElementById("ghjldemo").innerHTML = "Member!";
}
</script>

```

Thanks,  
Gunnar

---

<div class="post-metadata">

### Author: ![vinothkannans](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/vinothkannans/32/86465_2.png) [@vinothkannans](https://meta.discourse.org/u/vinothkannans)
#### Post date: [October 28, 2017, 8:40pm UTC](https://meta.discourse.org/t/check-for-group-membership-in-header-code/72642/10 "2017-10-28T20:40:26Z")

</div>

Better to use CSS here

```plaintext
<p id="ghjldemo"></p>

```

```plaintext
#ghjldemo:after {
  content: "Regular member!";
}

.anon #ghjldemo:after {
  content: "Not a member!";
}

.primary-group-patreons #ghjldemo:after {
  content: "Patreon member!";
}

```

In above three styles `#ghjldemo:after` should be in first always.

---

<div class="post-metadata">

### Author: ![Gunnar](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/gunnar/32/119647_2.png) [@Gunnar](https://meta.discourse.org/u/Gunnar)
#### Post date: [October 28, 2017, 9:08pm UTC](https://meta.discourse.org/t/check-for-group-membership-in-header-code/72642/11 "2017-10-28T21:08:42Z")

</div>

> [@vinothkannans](#):
>
> Better to use CSS here

Awesome! I had no idea CSS could do that. It works, and thanks for adding the anon. Perfect!

---

<div class="post-metadata">

### Author: ![Gunnar](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/gunnar/32/119647_2.png) [@Gunnar](https://meta.discourse.org/u/Gunnar)
#### Post date: [January 23, 2019, 3:12am UTC](https://meta.discourse.org/t/check-for-group-membership-in-header-code/72642/12 "2019-01-23T03:12:45Z")

</div>

> [@vinothkannans](#):
>
> Better to use CSS here

Actually, as of v2.2.0.beta9+29 `.anon` doesn’t work anymore. OTOH, `.primary-group-patreons` still works fine. Instead, what happens now for users who aren’t logged in is that they’re getting the “Regular member!” banner.

Did something change in Discourse? Anyone else seeing this?

Gunnar

---

<div class="post-metadata">

### Author: ![awesomerobot](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/awesomerobot/32/142900_2.png) [@awesomerobot](https://meta.discourse.org/u/awesomerobot)
#### Post date: [January 23, 2019, 3:24am UTC](https://meta.discourse.org/t/check-for-group-membership-in-header-code/72642/13 "2019-01-23T03:24:00Z")

</div>

> [@Gunnar](#):
>
> Did something change in Discourse? Anyone else seeing this?

Yes, I can confirm the `.anon` class is missing. We should fix that.

@david I _think_ this might have happened in your commit here? [FEATURE: Allow the base font size to be changed on a per-user basis (… · discourse/discourse@1ebd3db · GitHub](https://github.com/discourse/discourse/commit/1ebd3dbbd02a684b139e74b53d0545f15d78a1af#diff-127a850b7d7b20173ad3fba88f8a25e3)

---

<div class="post-metadata">

### Author: ![vinothkannans](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/vinothkannans/32/86465_2.png) [@vinothkannans](https://meta.discourse.org/u/vinothkannans)
#### Post date: [January 23, 2019, 4:46am UTC](https://meta.discourse.org/t/check-for-group-membership-in-header-code/72642/14 "2019-01-23T04:46:20Z")

</div>

Fixed. Now `.anon` CSS class is included in the html tag again

[https://github.com/discourse/discourse/commit/70b56c8332a5d54e79bc48af66bb4f17a5f0ad3d](https://github.com/discourse/discourse/commit/70b56c8332a5d54e79bc48af66bb4f17a5f0ad3d)

---

<div class="post-metadata">

### Author: ![Gunnar](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/gunnar/32/119647_2.png) [@Gunnar](https://meta.discourse.org/u/Gunnar)
#### Post date: [January 23, 2019, 5:09pm UTC](https://meta.discourse.org/t/check-for-group-membership-in-header-code/72642/15 "2019-01-23T17:09:59Z")

</div>

> [@vinothkannans](#):
>
> Fixed

Verified. Thanks for your help!

---

<div class="post-metadata">

### Author: ![Cozdabuch](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/cozdabuch/32/139120_2.png) [@Cozdabuch](https://meta.discourse.org/u/Cozdabuch)
#### Post date: [March 12, 2019, 11:38am UTC](https://meta.discourse.org/t/check-for-group-membership-in-header-code/72642/16 "2019-03-12T11:38:45Z")

</div>

I’m trying to do something with CSS (as a bandaid/painting with whiteout) since I have no “proper” way to do this.

I’m trying to hide all contents in a category from EVERYONE not in a specific group. While group permissions do the trick mostly, it doesn’t hide the contents from an admin. This is a problem with our board as the admin (me) should not see the contents of an executive group. (this is a business teams instance)

I know what and why this is a bandaid. Until the nature of things change with discourse access control, this is what I have to do.

  
 I want the category contents invisible to the admin(s), but visable to the members of the a specific group:

The category name: secretary  
The category id: 33  
The group: secretary

**Here’s my code that hides ALL within the category. It works to hide the content from the admin/(me).**

**This part works**

```
.topic-list-item.category-secretary { 
    display: none; 
}

```

**Here’s what I’ve tried to restore visability to the members of that group:**

**This part doesn’t work:**

```
.primary-group-secretary .topic-list-item.category-secretary { 
	    display: table-row; 
}

```

Can anyone help with this? Fix my code?

---

<div class="post-metadata">

### Author: ![vinothkannans](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/vinothkannans/32/86465_2.png) [@vinothkannans](https://meta.discourse.org/u/vinothkannans)
#### Post date: [March 12, 2019, 12:39pm UTC](https://meta.discourse.org/t/check-for-group-membership-in-header-code/72642/17 "2019-03-12T12:39:25Z")

</div>

> [@Cozdabuch](#):
>
> I want the category contents invisible to the admin(s), but visable to the members of the a specific group:

You should have a second non-admin account for that purpose.

> [@Cozdabuch](#):
>
> This part doesn’t work:

It should be the primary group of that user. Also make sure the order is correct.
