Article lists

Create custom article lists anywhere in the Help Center.

In this article

The objects available on each Zendesk page template are limited and can sometimes prevent you from creating the layouts that you want. The Article Lists plugin allows you to present a complete set of articles on any page using custom micro-templates.

Sections and categories can also be included to help build more advanced layouts like article trees.


The default template simply presents articles in an unstyled list.

  • <div data-element="article-list"></div>

You can fully style and customize the article list both in terms of its look-and-feel and functionality by specifying a custom micro-template as a plugin option.


Use data-element="article-list" on an element to create a list of articles.

If data attributes are used, you will need to ensure that the allow unsafe HTML setting is enabled within Guide.

The Article List plugin can be initialized using JavaScript:

<div id="article-list">...</div>

<script type="text/javascript">
  ready(function() {
    var articleList = document.getElementById('article-list');
    if (!articleList) return;

    new Articles(articleList, {
      // Options go here

When using a custom template additional data can be passed using the templateData option and it may be necessary to fetch and process objects from the REST API first. For example, the following code could be used on the Section page:

<div id="article-list">...</div>

<script type="text/javascript">
  ready(function() {
    var articleList = document.getElementById('article-list');
    if (!articleList) return;

    // Get categories, sections and articles
    Util.get(['categories', 'sections', 'articles']).then(function(collection) {
      // Get the object representing the current section
      var currentSection = collection.sections.filter(function(section) {
        return === {{}};

      // Get the current category
      var currentCategory = collection.categories.filter(function(category) {
        return === currentSection['html_url'];

      new Articles(articleList, {

        // Pass the collection to the plugin to avoid fetching it again
        collection: collection,
        // Specify a custom template to use
        template: 'custom-article-list',
        // Pass additional data to the templating function
        templateData: {
          currentSection: currentSection,
          currentCategory: currentCategory

The custom template could then render the article list with access to all categories, sections and articles as well as the current section and category objects.

The collection object containing articles (and possibly categories and sections) is sorted and organized such that parent objects have a children property, which is an array of child objects. For example, if categories are fetched, a given category’s children array will contain all section objects belonging to that category.


Options can be passed via data attributes or JavaScript.

For data attributes, append the option name to data- and use kebab case instead of camel case.

Name Type Default Description
collection object {} An object containing an array of objects representing articles (as well as possibly sections and categories). If the collection is not provided, the plugin will fetch categories from the Zendesk REST API.
categories boolean true True if category objects should be returned with articles.
sections boolean true True if section objects should be returned with articles.
categoryId string
null Limit articles to those in a given category.
sectionId string
null Limit articles to those in a given section.
labels array [] Limit articles to those with a given set of labels.
properties array See below The list of properties from the REST API response to pass to the templating function.
template string
null The name of the template to use.
templateData object {} Additional data to expose to the templating function.

The following article properties are passed to the templating function by default:

  • id
  • title (used for articles)
  • name (used for categories and sections)
  • html_url
  • position
  • promoted
  • draft

The following section and category properties are required by the plugin to sort the collection of articles and also available within custom templates:

  • section_id
  • category_id


Class Properties
articleList.render Fires when the article list has been rendered.