Scott Bowen

So I added @Marcel's JS and CSS code to specify specific users that should have a badge and it works great (thanks again!) when they create a new post, but I noticed that when they comment on a post the badge doesn't show up. I've tried adding some JS to catch the ".comment-author" class, but it doesn't do anything (see code below).

I've also removed the code that refers to ".post-author" or switched the order and the badge still shows up next to their name as the post author, but still not the ".comment-author"

// Adds custom badges for individual community forum users
var productTeam = ["Name1", "Name2", "Name3"];
var csTeam = ["Name4", "Name5", "Name6"];
$('.add-badge').each(function(index) {
if ($.inArray($.trim($(this).text()), productTeam) > -1) {
$(this).addClass('productTeam');
}
else if ($.inArray($.trim($(this).text()), csTeam) > -1) {
$(this).addClass('csTeam');
}
});
if ($.inArray($.trim($('.post-author').text()), productTeam) > -1 ) {
$('.post-author').addClass('productTeam');
}
else if ($.inArray($.trim($('.post-author').text()), csTeam) > -1 ) {
$('.post-author').addClass('csTeam');
}
if ($.inArray($.trim($('.comment-author').text()), productTeam) > -1 ) {
$('.comment-author').addClass('productTeam');
}
else if ($.inArray($.trim($('.comment-author').text()), csTeam) > -1 ) {
$('.comment-author').addClass('csTeam');
}

});

Thanks Marcel! I was also hoping to skip that process of adding each person in JS, but I can do this for now. I appreciate you sharing your example!

I have a question similar to @Marcel's a few months ago: We set up SSO for our help center, so anyone with a log-in to our service can participate in the community. I've set up badges for our agents, but I'd like to add a badge or image for any of our employees that participate in the forum.

I've created an organization that includes anyone with our company's email address—Can I set the organization up as a target (like this example does with "agents") to create a specific badge?

Would it be something like:

{{#is post.author.organization 'Grow Employees'}}...

I tried this, but "organization" wasn't something I could reference this way. Is there a way to do this?

If you search for "Tables" in the CSS, you will find the section of attributes for tables in the Help Center. You can tweak the code here to change any table attributes. If you have a couple different ways you want to format specific tables, you can copy that block of code and create a new style. Just make sure to rename the style (For example, it could be something like ".table-small")

If you're not familiar with the HTML for tables, "th" means the table header row, "tr" means the table row, and "td" means each cell in the table.

So if you wanted to format tables to look like your image example, you could set the borders to be orange and affect the padding in the entire table in the "table" class, then specify the blue background and bold font in the "th" class.

This page about HTML table properties can help as well to see the formatting options available, but remember that if you make any formatting changes in the HTML for an article, it won't affect any other tables in the help center.

Since not all of our company’s customers have direct access to a live support channel (due to different pricing packages) I wanted to make sure that the help articles that all customers have access to are helpful for them. I needed more detailed feedback than just the “Was this article helpful?” yes/no buttons.

Hotjar's polls are the little popups at the bottom of your screen that can ask any question you want, and you can also add logic to show other questions based on the responses.

We are using Hotjar for our company website, so I was able to easily install it to our help center and verify that it was working. Once it's installed, you need to remove the voting options from the articles template and then create your poll.

Disable the Article Voting

The next step is to remove the voting options from every article. Go to Customize Design (the eyeball in the left menu) > View Theme > Edit Code > Then click on the “article_page.hbs” template.

Add “{{!--” and “--}}” around the block of code that includes the div class “article-votes”, then publish the code.

Create a Poll in Hotjar

Next you can create a new poll in Hotjar. (You can do something similar with other services, but some specific options may vary.) Many of these settings, like color, will be your personal preference, but there are three main settings to pay attention to:

1. Targeting

For this, you can decide what devices you want to target, but to make sure the poll only shows up on the article pages, make sure that "On pages I specify" is selected, and choose "URL starts with" as the operator and enter your help center domain with "/hc/en-us/articles" as the URL. (Make sure to change the language and country info if you need to.)

You probably could also use "URL contains" and just "/hc/en-us/articles/" to get the same results.

2. Questions

You will set the questions you want to ask in the "Questions" section. Here's the basic outline I used and where I added in some logic:

1. Was this article useful? (Yes/No)
2. What feedback do you have for this specific article? (Options below)

• It is missing information.
• The information is inaccurate/out of date.
• It doesn’t explain my use case.
• Images weren’t helpful.
• Other (Please give more detail)
• (They would then be taken to another question asking for more details based on their answer in #2.)
• Any additional feedback

Click on the green signpost button to add any logic based on how they respond. For the first question ("Was this article useful?"), I set it so if they answered "Yes" they were directed to give any more feedback, then to the thank you message. If they answered "No" they were directed to the next question:

For the second question, I created another text response question for each of the options to get more details on that specific response, and I set up the logic to direct them accordingly:

3. Behavior

These settings are also more your personal preference. I set the poll to launch when the user scrolled through half of the article so I knew they had at least skimmed most of it, and I set it so it would always show the poll, even if they had already responded on a different article.

Using the Results

You can export your data as a CSV or just read through the responses in Hotjar to look for any trends or fix any articles that need attention. Not every respondent has filled out all of the questions, but even if they only get to question 2 it does still give a general idea of which articles might need attention and what issues to look for.

Other Uses

You can use the similar page targeting logic to get feedback on other pages. For instance, I created another poll that targets URLs starting with “https://help.grow.com/hc/en-us/search” to get feedback on search results and more detail on what they were looking for when they tried their search term.

I removed the voting option from all our articles and set up a poll using Hotjar to get this feedback. It pops up when the user scrolls halfway down the page. I was able to add in some logic to request more details based on their responses. (https://help.grow.com/hc/en-us)

If this was built into Zendesk that would be great!