How can I hide or show HTML based on user's role or group?

Return to top
Have more questions? Submit a request

43 Comments

  • Jeremy Robinson

    Aaron - one last bit, that we did when we went through a user tag phase for our beta rollout of the community aspect in Zendesk was the bulk update with CSV for users, that way we didn't have to manually go in and update one at a time. 

    0
  • Brett Bowser
    Zendesk Community Team

    Thanks for sharing this solution Jeremy!

    1
  • Jean-Baptiste Hennion

    Hello ! This oslution seems to not work anymore with the new template version !

     

    https://support.zendesk.com/hc/en-us/articles/360043187273#topic_llb_t5g_skb__section_rxc_dbd_tkb

    0
  • Simon Agliati

    Does anyone know how to show/hide based on a users role by using Curlybars if statements? Is this possible?

    0
  • Kay
    Community Moderator

    Simon Agliati the only way to do that is documented above here.

    // Show div html based on role
    if (HelpCenter.user.role=="anonymous"){
    $("div.anonymous").show();
    }

    if (HelpCenter.user.role=="end_user"){
    $("div.end_user").show();
    }

    if (HelpCenter.user.role=="agent"){
    $("div.agent").show();
    }

    if (HelpCenter.user.role=="manager"){
    $("div.manager").show();
    }
    0
  • Ron de Vries

    Hello! 

    Does anyone have any experience or knowhow how to show the Community for a specific User Segment only? I have a User Segment ''Staff'' which are the employees or our company. Since we first want to roll-out the Community internal I am looking for a way to have it shown only to that specific User Segment. I do think the User Segment has an ID, maybe I can target that using JavaScript?

    Any help is much appreciated. Thanks and have a great New Year!

    Ron

    0
  • Nicole Saunders
    Zendesk Community Team

    Hi Ron, 

    All you need to do is set the visibility of all of the topics in your community to that internal user segment. 

    You may need to hide the link to the community from en-users on your Help Center with a little custom code, otherwise they'll click it and show up to an empty community. Then just make sure you give your employees a direct link to the community as they won't be able to navigate to it. 

    0
  • Peter Hochstrasser

    Hi

    I'm trying to apply this to Copenhagen 2.9.0 which does not have jquery included. Do I need to add jquery or is there an internal way to get this working?

    0
  • Dave Dyson
    Zendesk Community Team

    Hi Peter -

    It is possible to import jQuery into your theme: Importing or upgrading jQuery

    Hope that helps!

    0
  • Peter Hochstrasser

    Hi Dave Dyson

    I have been aware of this, however, the question is if this is avoidable.

    I take this to mean that only with jQuery it is possible to manipulate style attributes of entities I do not know perfectly well where they sit on the DOM tree.

    So, I'll add it to get the recipe working again. 

    May I suggest to update this article to include the jQuery import (in a way that works for all cases) in order for the recipe to work again.

    Yours truly.
    Peter

    0
  • Peter Hochstrasser

    Hi all

    I didn't want to add jQuery just because I needed this simple functionality.

    My solution is:

    // Show div html based on role
    function checkDivsForRole(userRole) {
    if (HelpCenter.user.role==userRole) {
    var elements = document.querySelectorAll("div." + userRole);
    for(var i=0; i<elements.length; i++){
    elements[i].style.display = "flex";
    }
    }
    }

    checkDivsForRole("anonymous");
    checkDivsForRole("end_user");
    checkDivsForRole("agent");
    checkDivsForRole("manager");

    Note that the actual display attribute value might be a different one - I used flexbox so "flex" is what I need, if you work with standard means it might be "block", "inline" or even another value.

    Yours truly

    Peter

     

    0
  • Dave Dyson
    Zendesk Community Team

    Thanks for posting your workaround, Peter, and thanks again for the heads-up! I've alerted our team so that the need for jQuery (and a link to the installation instructions) can be highlighted.

    0
  • Jordan Dayton

    We created a variation of what Aron shared here. thank you!

    We just need to slightly tweak this...

    What can we tweak in the JS to allow us to hide content from everyone except a particular SEGMENT that we call "Ticket_Access."

    Segments are used to identify groups of users and granting them access to different categories/sections/articles within ZenDesk GUIDES. 

    We'd like to be able to add specific users to a particular SEGMENT (Ticket_Access) and make content visible or hidden based on a particular segment...

    Can we use this code and just tweak it a little?

    var orgs = HelpCenter.user.organizations;
    for (var i = 0; i < orgs.length; i++) {
    if (orgs[i].name == 'Ticket_Access') {
    $("div.Ticket_Access").show();
    }
    }

    Can someone help us out with this?

    0

Please sign in to leave a comment.

Powered by Zendesk