Recent searches


No recent searches

How to include Article in Multiple Sections



Posted May 22, 2020

How to add an HC Article to multiple sections (using a redirect)

Zendesk level:  Intermediate
Knowledge:  Javascript, Guide Template Editing
Time Required:  10 minutes

Documentation, customizations, and troubleshooting on GitHub: https://github.com/Ajhad1/Zendesk-Customizations/tree/main/Guide/How-to-include-Article-in-Multiple-Sections

Based/Inspired by https://support.zendesk.com/hc/en-us/articles/217958367-Redirecting-traffic-from-deleted-Help-Center-articles

Use Case:

My company has many articles that fall under multiple sections. To avoid having to update duplicate articles, we have elected on creating redirect articles that lead to the "correct" article but still allow the article to be listed in the section.

How it works (simplified):

If an article ID is a label in an article, the article will be redirected to the article ID in the label.

How to Use It:

Once the code has been implemented, all that is necessary is for an article ID to be added as a label to the article. 

Prerequisites:

  • You must be using Zendesk Help Center.
  • You must have access to the article_page.hbs file.
  • Your customers must allow Javascript in their browser.

How to Install:

  • Navigate to the Guide Admin Center to edit the themes.
  • Add the code to the respective location within the appropriate tags. GitHub
  • To test add an article ID to the tag of an article.
  • That's it.

Notes:

  • This is not a true duplicate or replication of data in the articles. It is simply a redirect to another article.
  • There is plenty of validation that can be added for article IDs added to the label.
  • This is more of a proof of concept than anything else.
  • It does work as is but there may be issues if the labels are not validated and an invalid label is added.
  • If anyone would like to add some validation or other code improvements, I have no issue with updating the article to reflect.
  • Removed the need to manually adjust the code for the specific subdomain and language. It should pull the current language and subdomain for use in redirection.

Troubleshooting:

https://github.com/Ajhad1/Zendesk-Customizations/blob/main/Guide/How-to-include-Article-in-Multiple-Sections


0

37

37 comments

image avatar

Andrei Kamarouski

Community ModeratorThe Wise One - 2021

Great tip, thx! 

0


@...

I have many more tips to come but this seemed particularly useful. 

0


image avatar

Andrei Kamarouski

Community ModeratorThe Wise One - 2021

@..., can't wait to read them =) 

0


image avatar

Brett Bowser

Zendesk Community Manager

Awesome tip Alejandro! We will get this added to our weekly digest so others can take a look :)

0


@...

I think I have made it into one of those before. :)

-----------------------------------------------------------------------------------------------------------

@...

Here is a link to some of the tips I plan on writing up. 

Ranking Tips to be written up

I am looking for some feedback on what users would like me to write up first. 

My original list had no preference on which I would write up first. Just a list off the top of my head. 

0


Hi Alejandro,

I tried to implement this great tip but it does not work for me...

If I understood correctly: for eg I have one article appearing in 2 sections: Section A and Section B. 

I create a first article called Hello and publish it in Section A. I create then a second article called also Hello but this time in Section B. I copy the article ID of the 1st article created in section A and copy this ID in the labels of the second article in section B. 

Now if I update the article in section A, the article in section B will automatically be updated. And same for the other way around.

Is this correct? 

Thank you in advance,

Chloé

 

0


@...

Sorry for the late response. 

--------

This workaround does not replicate or duplicate any information. What it does is actually redirects the user when they click on a duplicate article. 

In your example, you took the article ID of Hello in Section A and added it as a label to the duplicate article in Section B. Assuming all of the code is working correctly, then this would cause any user that goes to the article in Section B to automatically be redirected to the article in Section A. 

This allows you to only have to edit the article in Section A, as all users will be redirected to that article instead of the duplicate articles. You can almost think of them as placeholders. Any text you put in the article in Section B will not be doing anything as the user will have been redirected with the redirect label you used. 

------

Sorry if this is a bit confusing but I will answer any questions you may have to the best of my abilities. 

0


Hi Alejandro,

Thank you for your reply.

I do have one question: When I create the 2nd article in section B, do I still need to copy the content? Or only enter the ID article in the label?

Thanks in advance,

Chloé

0


You do not have to copy the content. 

----

But, what I do, to cover my bases is write a boilerplate message, something like this:

"This article is a duplicate. The original article is http://(companyID).zendesk.com/hc/en-us/articles/(articleID)"

That way if for whatever reason the redirect does not work, the user will still be able to get to the content.

1


Hi Alejandro,

Thanks for your quick reply. I tried again but it seems to do not work still.. 

I entered a label= article id number.

Do you have to enter the javascript and htlm codes on a specific line/section in the article_page.hbs or script.js?

Thanks again,

Chloé

0


Chloé Mauduit

You should not have to place the code on a specific line/section in the file. 

That being said, I put the code for the article_page.hbs at the very top. Make sure you are not putting the code inside another code block. This could stop the code from working.

Thankfully, I have included some console logging so that should help us diagnose what is going on. Open any article and pull up the console (usually the console can be opened with control + shift + i) and see if something along the lines of the following is visible:

This will tell us if the code for adding the labels to the article is working or not. 

--------

If you can please provide copies of your entire article_page.hbs and the script.js that should help as well. 

-------

Also, if you do not mind, send me a link to your Help Center and I can check that the JS is working correctly as well. 

0


Hi Alejandro,

Thanks for your quick reply.

I have tried to follow every steps and tips you gave me but it still does not work...

Here are my Javascript and article page codes:

And here is the link of our Help Centre: link.

Thank you very much for your support,

Chloé

0


I am taking a look at your HC and it looks to be set up correctly. 

I can see that the article page script is working as the console logs are showing up. 

---------

Let's confirm a few things:

I went to this article and the labels shown in the console logs are "Roadmap to Zero Programme", "Input", "MRSL", "Candidate", "List". Is this correct for that article?

Can you give me a link to an article that should be redirecting but is not?

0


Yes I confirm that this article has those 5 labels assigned.

Here is one article that should be redirected but is not: https://knowledge-base.roadmaptozero.com/hc/en-gb/articles/360010748977-Registering-on-the-ZDHC-Gateway-Frequently-asked-questions

Thank you!

Chloé

0


I have figured out the problem but I am still trying to figure out how to fix it for you.

For some reason, your script.js is running before the content starts to load. The content loading is where the labels are added to a variable. The script then checks that variable and does the redirecting. 

Because the script.js is checking the variable before it is set, this means that it always believes that there are no labels. 

I am thinking of a modification to my original script to see if I can fix this for you.

0


I have adjusted the code to fix the issue of the script.js running before the article_page.hbs ran.

Instead of splitting the code between the two, I have implemented all of it in the article_page.hbs. Now there is no way for the redirect portion of the script to run before the "labels" variable is populated. 

I have updated all of the above documentation. 

Give that a try for me. 

Also, remember to remove the code from the script.js as it would be duplicated if not. In your case, this wouldn't cause a problem but it is best practice to remove unused code. 

0


Hi Alejandro,

Thank you so much, it works perfectly now!! Huge thanks!!

Chloé

0


Chloé

You are absolutely welcome. 

--------------

This version of the code is actually better as it consolidates the code and will not run unless it is an article page. 

--------------

Let me know if you have any other trouble. Have a great weekend! :)

0


Hello Alejandro,

Thank you for this creative idea. Seems to be working fine for me so far.

I have a a question. I have a knowledge base in 4 other languages besides English.

How would I extend your code for those other languages?

Is it as easy as just adding an additional line of code for each language one after another?

Or is there more work to it?

ex.. 

window.location.href = 'https://(yoursubdomain).zendesk.com/hc/en-us/articles/' + labels[i];
window.location.href = 'https://(yoursubdomain).zendesk.com/hc/fr/articles/' + labels[i];
window.location.href = 'https://(yoursubdomain).zendesk.com/hc/de/articles/' + labels[i];

 

0


@...

Sorry, it took me so long to respond.

I was not taking into consideration multiple languages when I made the code. I am updating the code to work with multiple languages and removes the need to specify the subdomain.

Code to Replace

window.location.href = 'https://identityfusion.zendesk.com/hc/en-us/articles/' + labels[i]; 

Code to Replace with

// grabs the url and removes the extraneous information
var baseurl = window.location.href.match(/^([\w/:.]*)([/])([hc]+)([/])([\w-]*)/g);

// some logging for debugging
console.log(baseurl + '/articles/' + labels[i]);

// changes the page to the baseurl + article section + the article ID
window.location.href = baseurl + '/articles/' + labels[i];

The new code grabs the current URL, including the language portion, then removes the extraneous part to create a baseURL, then adds the article section, and the article ID.

I added some logging for debugging just incase.

 

Give that a try for me.

My org does not have multiple languages so it is a little harder to test but that should work for you. 

0


Thanks for the code - very useful feature.

However, the amended code shown above doesn't work - it is missing a } , just before the </script>.

1


@Stephen Hallsworth

Thanks for letting me know. 

I adjusted the code to include the missing bracket.

Thankfully, the photos are correct as I simply missed it when copying it.

1


@... Thanks for all the help. If the Labels are not showing in the console, how do you fix that?

0


@...

If the console log is not giving you any information then it is most likely an issue with code implementation. 

Is the code added to "article_page.hbs" ?
Are you on an article page when you are checking the console? (the console will not show anything if you are not an article page)
When did you copy the code? (There was a typo about a month ago.)
What theme are you using?
Can you post a link to your HC?
Can you provide your code as it is implemented now?

0


Alejandro Colon - Thanks for the speedy response!

I have used the code in the test environment but have not tried to publish it as it was not working in the Preview:

- Yes, I was on the article page

- I copied the code yesterday (maybe I'm adding the base URL in the wrong spot?

- Copenhagen theme

- Link to HC page that has 5 tags

0


@...

One thing I notice is that you modified the code a bit. 

var baseurl = window.location.href.match(/^([\w/:.]*)([/])([hc]+)([/])([\w-]*)/g);

The baseurl is automatically generated when the page loads. So, this line does not need to be modified for the code to work. But, that being said that should still allow the labels to show up in the console. 

----------------------------------------

It looks like you put your code at the very top in the photo. It is important to make sure it is not nested in any other code. In the photo, I cannot confirm it is in "article_page.hbs" but assuming that it is, I am not sure why the code is not working. 

As a troubleshooting step, you can try adding this code to see if anything shows up in the console and rule out some things. 

console.log("This is a test");

Add it below the <script> but before anything else in the existing code. If that does not show up in the console when you go to the page then something is either stopping the code from running or it is not getting pushed to the page. 

-----------------------------------------

I know that sometimes the preview does not always work correctly. Normally, I wouldn't suggest pushing code if it is not working but if you can in this instance. That may help narrow down the issue. 

At this point, the console should show at least "Labels:" because that part of the code is not reliant on anything but javascript. That is what is making me think this might be related to the preview not working correctly.

0


Alejandro Colon - Thanks! I will keep playing with it :) appreciate all of your help.

0


Hi Alejandro,

I have the following:

Category: DRI
Section: Getting Started
Article: Building a Dashboard

I want to have the following:
Category: DMI
Section: Getting Started
Article: Building a Dashboard (redirected to DRI > Getting Started > Building a Dashboard)

How do I do this? Meaning, how do I get it listed in my second example to get redirect to the first example. And, what label do I add to the article? I have many articles I want located physically in one section but linked to different sections.

Any help would be much appreciated,
Oren

0


@...

How far have you gotten with the instructions in the post?

If you have already input the code, did you add an article id to the labels of the post you want to be redirected?

0


Thanks for getting back to me. I was able to implement the code, but what I am missing is how to include that same article in two places (how do I list it in 2 places, the original section, and then the other section where I want it to be linked from). So, it exists in one place already. I want to put the article link in another place, but I can't figure out how to do that. 

0


Please sign in to leave a comment.

Didn't find what you're looking for?

New post