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

Return to top

10 Comments

  • Nicole Saunders
    Zendesk Community Manager

    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 Manager

    Hi Peter -

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

    Hope that helps!

    0
  • Peter Hochstrasser

    Hi @...

    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 Manager

    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
  • Heather Firth

    If you add the widget to your product can you use the API to only show to certain users who have the Admin role in our product? I know Pendo can do this but didn't know if this was possible for the widget.

    0
  • Austin Killey
    Zendesk Customer Care

    Hey there @...!

    Good idea with widget-based workflows, and this should be possible to pull from Guide roles at least.  You and your team could add some widget API commands like hide and show to hide the widget by default, but then set up a Javascript condition like the ones discussed in this article.  Something like this could work with some tweaking as you see fit:

    if (HelpCenter.user.role=="manager"){
    zE('webWidget', 'show');
    }

    For Support roles like Administrator, you could get super close by having all your administrators become members of the same organization. From there, you can set up your custom Javascript code to pull from HelpCenter.user.organizations.  That way, if one of the user's organizations matches up with your admin-only organization, you could fire off that same "show" command for the web widget. 

    Hope this helps! Let us know if you need anything else.

    2
  • Heather Firth

    Thanks @..., could we potentially use our products user roles instead of the help center ones?

    0

Please sign in to leave a comment.

Powered by Zendesk