If you've deleted articles from your help center, you may have noticed that users occasionally still attempt to access the URLs associated with these articles. No matter the source of such traffic, you can automatically redirect users visiting these URLs to more valuable pages.
Accessing your help center's custom JavaScript file
The solutions contained within this article may affect Google search rankings since they contain Javascript redirects. For this reason, they may not be suitable for long-term or large-scale deployment.
To implement the solution, you must first access your help center's JavaScript file:
- Sign in to Zendesk Support as an administrator. Next, click theZendesk Productsicon () in the top bar, then selectGuide.
- In the top right corner of Zendesk Guide, selectGuide admin.
- Click theCustomize designicon () in the sidebar.
- ClickCustomizeon your theme.
- Click,Edit code.
- Click thescript.jsfile.
See the GIF below for a visual example of accessing the JavaScript file:
This article includes several solutions that, in most cases, can redirect traffic:
- Example 1: Redirecting a set of deleted articles to new article equivalents
- Example 2: Redirecting untranslated articles to an existing language
- Example 3: Redirecting all deleted articles to one specific page
- Example 4: Generalizing or specifying which articles (or community posts) redirect to a particular page
Example 1
Example 2
Example 3
Example 4
Example 1: Redirecting a set of deleted articles to new article equivalents
In this example in which, a help center has a set of old, deleted pages, each corresponding to a new page to which we are redirecting.
Within the first few lines of the JavaScript file, you will see a line reading:
$(document).ready(function() {
Insert the following code directly above that line:
var oldIds = ["217352077", "216552968"]; var newIds = ["216553098", "216552958"]; for (var i = 0; i < oldIds.length; i++){ if (window.location.href.indexOf(oldIds[i]) > -1) { window.location.href = 'https://YOURSUBDOMAIN.zendesk.com/hc/en-us/articles/ ' + newIds[i]; } }
Before saving it, you must customize a few things about this script. The first part of the code you'll edit is here:
var oldIds = ["217352077", "216552968"]; var newIds = ["216553098", "216552958"];
This is a list of the old article IDs and new article IDs. Add your article IDs here. To find an article ID, view the article in your browser (or the URL from your analytics platform). The URL will look similar to this:
https:// YOURSUBDOMIAN .亚博zendesk.com/hc/en-us/articles/203664386-Help-Center-guide-for-agents-and-end-users
In this case, the article ID is "203664386".
To redirect properly with this solution, the article IDs must be at the same position within the array. In this case, an article whose URL contains "217352077" will now redirect to "216553098". And an article containing "216552968" will now redirect to "216552958".
Be sure to keep these IDs wrapped in quotes, as seen above, and separated by a comma in each case. So if you added a new set of redirects, it would look like this:
var oldIds = ["217352077", "216552968", "216552902"]; var newIds = ["216553098", "216552958", "216552944"];
Next, you will have to edit the URL in this line:
window.location.href = 'https://YOURSUBDOMAIN.zendesk.com/hc/en-us/articles/ ' + newIds[i];
Make sure you use your subdomain, or alternately, use your entire help center URL as it normally appears in your help center if it is white labeled to your URL. Do not remove the end of the line, where it reads "+ newIds[i];". This is how the loop appends your new article ID to your URL. The code will fail without it.
Example 2: Redirecting untranslated articles to an existing language
In this example where you have help center content in multiple languages. Let's say all of your contents exist in English, but only some of them exist in French and German. Users who try to access those articles in French or German will get an error page. This code allows redirects them away from the error page back to the existing English-language article:
var notDefaultLanguage = window.location.href.indexOf('/en-us/') == -1; var isArticle = window.location.href.indexOf('/articles/') > -1; var isErrorPage = $(".error-page").length > 0; if ( isArticle && notDefaultLanguage && isErrorPage ) { var newURL = window.location.href.replace(/(.*\/hc\/)([\w-]+)(\/.*)/, "$1en-us$3"); window.location.href = newURL; }
In this example, only a small amount of customization needs to be done. If your default help center language isn't English, you can replace that language. In the code, you'll see "en-us" appear in two places:
var notDefaultLanguage = window.location.href.indexOf('/en-us/') == -1;
and
var newURL = window.location.href.replace(/(.*\/hc\/)([\w-]+)(\/.*)/, "$1en-us$3");
Replace "en-us" in these two lines with your default language code. You can find your default language code in the URL for your main articles. For example, a URL for a French-language help center page will look like
https://[YOURSUBDOMAIN].zendesk.com/hc/fr/articles/214943538
with "fr" representing the country code.
Example 3: Redirecting all deleted articles to one specific page
In this example, a help center redirects all deleted articles (not including community posts) to a particular article.
Within the first few lines of the JavaScript file, you'll see a line reading:
$(document).ready(function() {
In this case, insert the following code directly below the line. Important note, inserting the above (as with the previous example) will not work for this example:
if ( window.location.href.indexOf('articles') > -1 && $(".not-found").length > 0 ) {
window.location.href = ' https:// YOURSUBDOMAIN .zendesk.com/hc/en-us/articles/216553068-error-redirect';
}
You'll need to customize the URL in this script before saving it. Replace it with the article URL you want your help center to redirect to.
This solution will only work if we ensure a ".not-found" class exists on your error page. So let's add one.
On the grey bar where the "JS" link appears, click on the "Home Page" link. Find and select "Error page" in that dropdown. In the error page, you'll find an area starting with the code{{#is error 'not_found'}}
. It will look something like this:
{{#is error 'not_found'}}
{{t 'nonexistent_page'}}
{{t 'mistyped_address_or_moved_page'}}
{{/is}}
You'll want to add a new class to the h2 element or any element within the'not_found' #is
tags so that it looks like this:{{t 'nonexistent_page'}}
Now you have all the elements in place that you'll need for a generally deleted article redirect.
Example 4: Generalizing or specifying which articles (or community posts) redirect to one specific page
你能更具体的或一般的溶胶ution by customizing the if statement. For example, to redirect from any deleted article or community post, change the if statement to:
if ( $(".not-found").length > 0 )
Alternately, to only redirect deleted articles that have the word "buttermilk" in the title, change the if statement to:
if ( window.location.href.indexOf('buttermilk') > -1 && $(".not-found").length > 0 )
Unlike the first solution presented, these solutions will briefly show the error page, then redirect to the new page. This is because we are using JavaScript to search for an element within the page, and to do that, we must first wait for the page to load.
46 Comments
Hi
This redirecting code was working just fine, but I just found out it is not working now. When I access the old page, 404 page shows up.
I added the new and old ID in the script today, but I didn't change other parts of the code.
Hi Sawako! I took a look at your help center and it looks like you aren't following the instructions in the article correctly. It states that you need to add the script before the JQuery function runs, however you have it after that line. Please move that above and let us know if that resolves it for you.
Greg Katechis
Thank you for checking my code!
The following code is already written right above the redirecting code. Could you see the attachment?
Right, which is the issue...it's supposed to be above that and you have it below it.
Greg Katechis
I moved the following code, but it still doesn't work.
$(document).on("click", function() {
$(".share-label").attr("aria-selected", "false");
});
Greg Katechis
no errors
Greg Katechis
Now it's working! thank you for helping me.
The problem was in other part of code.
Honestly, I am in awe that the Zendesk product team considered this release ready.
It's unreasonable to expect your users—help docs and technical writers—to have to know JavaScript to configure basic redirects for duplicate or obsolete pages. This is functionality that should have had a full WYSIWYG decade ago in the platform.
HeyGreg Katechis,
I look in our script.js file and it doesn't have the below line:
If that's missing, can we simply add it? Do you know which line would be the best place to add it? Thank you.
Hi Josh! I took a look at your help center and it is pretty heavily customized, so I'm assuming that's the reason that you're not seeing it. I would recommend talking to the devs that built that to see how they developed it to see if they can steer you in the right direction. As it stands, it really wouldn't be possible for me to tell you how to proceed in this situation, so they will be your best bet!
HiGreg Katechis,
Please take a look at my code as well. I have copy-pasted part of it here. Reading thru the comments, I have added it within the ready function. I don't see any jquery code above my code. Can you please help me understand why the code isn't working. As soon as I click on the old article link, I keep hitting this zendesk auth page.
Hello—I've had success with this workaround on the article level, but is there any way to make it work for anchor links? As our Help Center grows and evolves, the internal structure of the articles will often change, and headers (which have those anchors) will be deleted or moved to other articles, etc. But there are still links out there in the wild that point to these anchored links, and I'd like to be able to ensure they are redirected to where they need to be.
(Also, why is this so challenging in Guide? Every other CMS I've worked with supports redirects a lot more efficiently than this. Are there plans to enhance this?)
Does this process work for archived articles as well, or only for deleted articles?
Hi Zendesk team - does this option work with archived articles at all? or do I have to delete an article before I can go through the process of redirecting the URL?
I'd prefer archiving, just in case I want to re-work content later.
Please advise?
Cheers
E.A. Brown
HiElizabeth BrownandPhilip Addison,
While you are waiting for Zendesk team to respond, I can share my experience here. For me, the code only worked when I archived the old articles. "Unpublishing" the old article led to a redirect to an authentication page and not to the new article.
I haven't tried deleting an article and redirecting it yet, so cannot comment on this part.
Best,
Ani
Pleasesign into leave a comment.