Skip to content

"Claytons" Collections

Why and what?

Canvas Collections is able to modify the default Canvas modules view to provide a more useful and engaging experience for students and teachers. There are two ways Canvas Collections can make this modification:

'Live' Canvas Collections

The standard "live" version of Canvas Collections requires that you have installed the Collections code - either individually or institutionally. This code runs and updated the Canvas modules view as you are watching (i.e. live).

If you or your students are unable to install the Collections code, then you can use the "Claytons" Collections to create a similar experience.

'Claytons' Canvas Collections

"Claytons" Collections is the Collections you have when you're not having Collections (a play on a marketing campaign for a drink). It's a way for one person to install and use 'live' Collections to create normal Canvas pages that contains the Collections visual representation. As a Canvas page, this can be viewed without the Collections code.

It is a way of semi-automating common advice from the Canvas community to manually create pages to workaround the limitations of Canvas' module view. Some examples of that advice, include: create full navigation using pages, create an inviting course home page, and home sweet home pages without tables.

Some 'Claytons' representations require external CSS

The Canvas Rich Content Editor (RCE) places limitations on the CSS/HTML that can be used in a Canvas page. These limitations constrain what can be achieved visually. Either directly or via Claytons.

A solution to this is to use external CSS files. There are two common ways to achieve this

  1. Canvas Theme Editor.
  2. Use of an external tool (e.g. Design Plus from CIDI Labs)

Both require Canvas admin access.

How does it work?

There are two steps to using "Claytons" Collections:

  1. Specify an output page for any of the existing collections .

  2. Update the output page for your collection.

Updating the contents of an output page is a manual process

Any changes you make using Canvas Collections are not automatically reflected in the output page. You will need to manually update the output page to see the changes. There are two different ways to update an output page:

  1. update the output page for a single collection; or,
  2. update the output page for all collections (Full Claytons).

What does it do to existing content in an output page?

Collections recognises two different situations, depending on whether or not the output page:

  1. does not already contain a Claytons content for the given collection; or,

    Collections will place the collection's content after any existing content on the page. 2. already contains Claytons content for the given collection.

    Collections will replace the old Claytons content with the latest version.

Collections does not modify or remove any non-Collection content.

Can an output page be used by more than one collection?


A single Canvas page can be an output page for a single collection or multiple collections.

If an output page is used by multiple collections, then the content of all the collections will be added to the output page. How this works will depend on the chosen navigation option.

Update all Collections (Full Claytons)

The "Full Claytons" option provides two advantages over the "single" update method:

  1. Update all collections with output pages at once.

    Rather than do a single update for each collection, Full Claytons updates all relevant output pages at once.

  2. Add navigation options between collections.

    As well as updating the output pages with the current content of the collections, Full Claytons can also be configured to add a Collections navigation bar to help the user change between collections. There are three navigation options summarised below.

The following image demonstrate using the Full Claytons functionality to:

  1. Update three collections at one time, all to the one output page.
  2. Add the Tabs navigation option to that output page.

The process shown, includes:

  1. Showing the existing state of the output page (the content generated by the previous animated image).
  2. Move to the Modules page and show that all three collections have been configured to use the same output page.
  3. Change the Navigation Bar Option to Tabs.
  4. Hit the Full Claytons update button.
  5. Step through all the alert boxes generated to show progress.
  6. Change back to the output page and reload it to see the updated content.
  7. Use the Tabs navigation to navigate between the different collections all visible on the same page.

The next animated image demonstrates the use of Full Claytons using the other two navigation bar options.

Creating a visual home page using full Claytons

Navigation options are intended to help the user navigate between different Collections. There are three navigation options - summarised in the following table.

Navigation Option Description
None No navigation interface is added to any of the output pages. Any existing navigation interface is removed
Pages Only works when each collection has a different output page. A navigation bar is added to each page, before each collection, to allow the user to navigate between the different collections.
Tabs Only works when an output page contains multiple collections. A tabbed navigation interface is added so that only one collection is visible at a time. The interface allows users to switch to a different collection on the same page.

The following animated image demonstrates the use of Full Claytons to change between different navigation options, and in doing so demonstrates the Pages and None options. The process shown, includes:

  1. Showing an existing output page that used the "update page" option (it has not navigation option).
  2. Moving other Modules page and opening the Collections configuration area.
  3. Making changes so that each collection has a different output page.
  4. Changing the Navigation Bar Option to Pages and performing a Full Claytons update.
  5. Stepping through the alerts showing the progress of the update.
  6. Changing back to the original output page and reloading to show the addition of the navigation bar and any other changes.
  7. Using the Pages navigation bar to navigate between different collections which are located on different pages.
  8. Moving back to the Modules page and changing the output configuration so all collections are using the same output page
  9. Changing the navigation option to the None option and performing a Full Claytons update.
  10. Stepping through the alert boxes showing the progress of the update.
  11. Changing back to the original to show that the Page navigation has been removed and that all of the collection's content is now on the same page without any navigation bar.