Can I redirect traffic from deleted help center articles?

Question

I have deleted articles from my help center. Can I redirect traffic from my deleted help center articles?

Answer

Disclaimer: This article is provided for instructional purposes only. Zendesk does not support or guarantee the code. Zendesk also can't support third-party technologies such as JavaScript, jQuery, or CSS. Post any issues in the comments section, or try searching for a solution online.

Yes, 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

To implement these solutions, access the JavaScript file of your help center:

1. Sign in to Zendesk Support as an administrator. Next, click the Zendesk Products icon () in the top bar, then select Guide.
2. In the top right corner of Zendesk Guide, select Guide admin.
3. Click the Customize design icon () in the sidebar.
4. Click Customize on your theme.
5. Click, Edit code.
6. Click the script.js file.

Note: The solutions contained within this article point to Javascript redirects. These redirects may affect Google search rankings. For this reason, they are not suitable for long-term or large-scale deployment. Instead, if you have a developer, use the redirect rules API, for page redirects on your help center.

Check the sections below for examples on how to implement common redirect workflows: 

• 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: Redirecting a set of deleted articles to new article equivalents

In this example, the 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() {

Note: This line may be missing if you use a recent version of the Copenhagen theme. In this case, place the code outside of the following listeners:

window.addEventListener("DOMContentLoaded", () => {
}

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, edit the part of the code, which lists the old article IDs and new article IDs:

  var oldIds = ["217352077", "216552968"];
  var newIds = ["216553098", "216552958"];

Add your article IDs instead of the ones above. To find an article ID, view the article in your browser. 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 the URL above, the article ID is 203664386.

To redirect properly with this solution, old and new 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. The article containing 216552968 will now redirect to 216552958.

Keep these IDs wrapped in quotes, as seen above, and separated by a comma in each case. It would look like this:

  var oldIds = ["217352077", "216552968", "216552902"];
  var newIds = ["216553098", "216552958", "216552944"];

Next, edit the URL in this line:

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

Use your Zendesk 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: "+ 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, help center content exists in multiple languages. If all your content exists in English, but only some of it exists in French and German. Users who try to access those articles in French or German will get an error page. This code redirects the visitors 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, replace that language. In the code, en-us appears 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. 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 the example below:

https://[YOURSUBDOMAIN].zendesk.com/hc/fr/articles/214943538

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() {

Note: This line may be missing if you use a recent version of the Copenhagen theme. In this case, wrap the suggested code into a new listener instead:

window.addEventListener("DOMContentLoaded", () => {
}

In this case, insert the following code directly below the line. Important note, inserting the above 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';
}

In this script, replace the URL with the article URL your help center will redirect to.

This solution will only work if we ensure a .not-found class exists on your error page. 

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 like this:

{{#is error 'not_found'}}
 <h2>{{t 'nonexistent_page'}}</h2>
 <p>{{t 'mistyped_address_or_moved_page'}}</p>
 {{/is}}

Add a new class to the h2 element or any element within the 'not_found' #is tags so that it looks like this:

<h2 class="not-found">{{t 'nonexistent_page'}}</h2>

Example 4: Generalizing or specifying which articles (or community posts) redirect to one specific page

Get more specific or general with this solution 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 it uses JavaScript to search for an element within the page, which needs to load first.