Using Single sign-on (SSO) to customize your end-users' knowledge base, email templates, and ticket forms

In support, and especially B2B support, it's a fairly common to restrict specific content in your knowledge base and/or your contact form depending on who's currently connected to your account. For example, when supporting multiple companies, you don't want Company A to see Company B's knowledge base articles. Company C might be the only one allowed to see a specific Ticket Form. Or, perhaps, Company D would like a specific email template. Every company has different customizations and you need to stay on top of them all.

Today, I will show you how you can easily customize your end-users' knowledge base, email template,s and ticket forms in Zendesk Support once and for all. Better yet, I'll show you how to automate this process using single sign-on (SSO).

We'll do this in 4 sections:

• Setting up a JSON Web Token to enable Single sign-On
• Creating a restricted knowledge base
• Customizing the Help Centre theme to hide/show ticket forms
• Customizing the emails being sent to your end-users based on the organization
• Final result

Note: One Zendesk Support feature covered in this article is ticket forms, which is currently available as the Professional productivity pack Add-on or on Enterprise. The rest of the article will still help you even if you don't use ticket forms.

Setting up JSON web token to enable single sign-on

To ease the process, we'll use single sign-on to create end-users based on the information that you already have in your database. For example, since you know that Mr. Travis Bickle works for the organization BlueBerry, you consider him as a VIP and that information is already available in your database. We'll simply create the user in Zendesk Support on the fly and put it under the correct organization.

We'll then use that organization to restrict access to KB articles and/or tickets forms.

1. Click the Admin icon ( ) in the sidebar, then select Settings > Security
2. Set up JSON Web Token between your identity management system and Zendesk Support by following this guide (don't hesitate to use one of our open source scripts )
3. Include the organization attribute in your JWT payload to create the end-user in the correct organization each time.

JWT claims hash: {"iat"=>xxx, "jti"=>yyy, "name"=>"Travis Bickle", "email"=>"[e-mail]", "external_id"=>"5678", "organization"=>"BlueBerry", "tags"=>"vip",  "locale_id"=>"8"}

You can see above an example response for Travis working at BlueBerry with the end-user profile tag vip . So at the moment that end-user is connected on your website and clicks on the Support link, for example, we'll create said end-user account in Zendesk Support with the correct information, like this one:

Creating a restricted knowledge base

One the great benefits of the Help Center is to be able to create multiple Knowledge Bases and restrict access to them by the end-user's language, tag, or organization through one Zendesk Support instance. In this example, we'll focus on the organization BlueBerry from Travis.

1. Sign into Zendesk as an administrator and click the Help Center icon ( ) in the sidebar.
2. Create your Help Center content and add a specific section for BlueBerry, to continue with this example.
3. Restrict access to that specific section only to people working for BlueBerry.

Now only end-users in the organization BlueBerry will be able to access this content.

We could go even further now and already restrict access based on the end-users with the Tag vip , for example. You have a bunch of possibilities within the same Help Center. Let's keep it simple for now.

Customizing the Help Center theme to hide/show ticket forms

Ticket forms are natively viewable by either all or no end-users. Now we'll need to create ticket fields, add them to a form and use JavaScript to make the form automagically show/hide based on the end-user connected.

1. Click the Admin icon ( ) in the sidebar, then select Manage > Ticket Fields.
2. Create your ticket fields . Don't forget to set fields to "Editable" so your end-users can see them.
3. Create at least two ticket forms . Don't forget to make them viewable by your end-users.
4. We'll now work with the organization name, BlueBerry, the specific BlueBerry ticket form ID, and add some JavaScript to our Help Center. Let's get crackin'!

A month ago, our colleague Robbert published a tip explaining how to hide/show fields. Since his JavaScript is way better than mine, let's follow his guide .

Find the ticket form ID

1. Click the Admin icon ( ) in the sidebar, then select Manage > Ticket Forms .
2. Select the appropriate ticket form from your list of ticket forms.
3. Find the ID number in the URL after the last slash.
   

Find the organization name

1. Click the Admin icon ( ) in the sidebar, then select Manage > People .
2. Browse or search organizations to find the right organization name. We'll continue with our example, BlueBerry

Have fun with JavaScript

$(window).load(function() {
   var i = 0;
   var cZendesk = false; //assume user is not part of the BlueBerry Organization
   //reserve space for additional organizations
   var checkExist = setInterval(function() {
      i++;
      if ($("a.nesty-input").length){
         clearInterval(checkExist);
         $("a.nesty-input").each(function() {
            $(this).bind( "click", function() {
               for (var c in HelpCenter.user.organizations) {
                  if (HelpCenter.user.organizations[c].name == "BlueBerry"){
                     cZendesk = true; //if user is part of the organization called "BlueBerry", then set its variable to true.
                  }
                  //reserve space for additional organizations
                  }
                  if (!cZendesk){
                     $("#TICKET_FORM_ID").remove(); //replace the "TICKET_FORM_ID" with the proper id from the dropdown list. Leave the pound sign intact.
                  }
            //reserve space for additional organizations
            });
         });
      }
      if (i > 10){
         clearInterval(checkExist);
      }
   }, 100);
});

Important! You will have to edit the code above, please follow these steps.

1. Replace "TICKET_FORM_ID" with the actual ticket form ID we found above.
2. Replace "BlueBerry" with the actual organization you want the ticket form to show for.
3. Copy the code block above.
4. Paste the code into the JavaScript section of your Help Center .
5. Save your template and publish changes to see the effects.

Customizing the look of outbound emails

This is optional, but you might also want to have a different look and feel of the emails being sent to Travis from BlueBerry compared to emails sent to "regular" customers. You can achieve this using Liquid Markup and triggers.

1. Click the Admin icon ( ) in the sidebar, then select Business Rules > Triggers .
2. To continue with this example, let's create a trigger with conditions:

• Ticket is Created
• Organization is BlueBerry

And actions:

• Add Tag blueberry

You may want to remove your company logo, if you added one, in the email template under Channels > Email .

Go back to Triggers, spot the default trigger called "Notify requester of received request", and clone it .

In the conditions, add

• Tag contains one of the following values - blueberry

Scroll down to the actions and modify the email being sent out

This is the original content:

Your request ({{ticket.id}}) has been received and is being reviewed by our support staff.<br /><br />To add additional comments, reply to this email.<br /><br />{{ticket.comments_formatted}}

This is the new content:

{% capture tags %}
{{ ticket.tags }}
{% endcapture %}
{% if tags contains 'blueberry' %}
<img src="https://LINK/TO/LOGO.png" /></center>
{% endif %}

Your request ({{ticket.id}}) has been received and is being reviewed by our support staff.<br /><br />To add additional comments, reply to this email.<br /><br />{{ticket.comments_formatted}}

We're using Liquid Markup to capture the Tags of the ticket and adding conditions to add different logos based on the tag present in the ticket. You can see a couple of other Liquid Markup examples here .

Final result

That's it! You can now rely on this customization to automatically create end-users via SSO from your identity management system. You'll know end-users will have access only to the information they should see and nothing else.

Now, let's see what Travis, the end-user from BlueBerry, can see compared to another end-user from a different organization.

Before (ticket submission):

After (ticket submission):

Before (knowledge base):

After (knowledge base):

Before (email):

After (email):