Jisc TechDis

Xerte Online Toolkits

Using the Categories page type

Introduction
This tutorial covers the use of the Categories page type which
allows you to add a ‘drag items to categories’ interaction
extremely quickly and easily. The categories pages created
are also fully accessible, enabling the drag and drop
interaction to be navigated and completed by keyboard
without the need for a mouse.

Pre-requisites
You should already be familiar with the basic steps required
to create or edit a learning object with Xerte Online Toolkits
before beginning this tutorial. (See relevant tutorials if
necessary)

Context
This categories page type can be used in many different
contexts and provides a more engaging way of presenting
information for the learner to navigate and check
understanding of a particular topic. e.g. organise items into
advantages and disadvantage or types of instrument etc. It’s
an example like the latter we will create during this tutorial.
You might use this on an IWB/Screen in a face to face class Key:
e.g. Organising concepts or of course for self-access/review.
New sequence
1 Sequential steps with screenshots for reference
2
Repeated steps without screenshots

© Jisc TechDis 2013 1 http://www.jisctechdis.ac.uk/xerte

 Adding a simple category interaction
3

5
1 It’s a quick and easy task to add a category interaction to
an existing or new learning object. To follow this guide simply 3 For this first example add the Page Title:
select an existing LO, or create a new project.
Types of instrument

2 4 Add an appropriate instruction to the Text box:

Select Insert
> Interactivity > Drag the instrument into the correct category
Categories to add
5 Click New Category
a category page to
the existing or new
LO.
6
2

6 Add the Category heading

Stringed instruments
7 Click New Category to add a second category

© Jisc TechDis 2013 2 http://www.jisctechdis.ac.uk/xerte

 12

8 As soon as you click somewhere else the Category

heading in the left icon panel will reflect your change. Click
12 We can now repeat the process for the Brass instruments
on the Stringed instruments category to select it
category. Select Brass instruments in the left panel and
then click New Item again.

9 Click New Item

13

10

11
13 Add four Items in the same way as previously:

Trumpet
10 Add the Item Text which will become the text to be
Trombone
dragged to the Stringed instrument category. Cornet
Guitar Tuba
11 Click New Item to add another and repeat for 3 items

Banjo 14
Mandarin 14 We are now ready to preview our interaction click Play.
Fiddle

© Jisc TechDis 2013 3 http://www.jisctechdis.ac.uk/xerte

 16 The user can Check Answers at any point and all correct
answers are identified with a green tick. N.B. The items can
be dragged from one box to the other and in a simple two
category interaction like this it’s obviously easy to correct any
incorrect placements.

Adding a higher level category interaction

15 In the previous example the learners were simply
remembering and testing their knowledge, or perhaps even
learning the basic categorisation of instruments for the first
time. However it’s also possible to use the category
interaction to test higher levels of understanding and
15 The user can drag the items to either category where they
analysis.
will snap into place.

16 17

17 Add a new Category page.

© Jisc TechDis 2013 4 http://www.jisctechdis.ac.uk/xerte

 In this example our items will contain phrases or in fact
verses rather than just one or two words…
18

19
23

24

23 Add the first Item Text:

Slings and arrows of outrageous fortune

24 Click New Item and add the second verse:
20
If music be the food of love play on
18 Add the Page Title:

Poetry approaches
19 Add appropriate instructions to the Text box:

Drag the sample verses into the right category

20 Click New Category.

25

21

22 25 Repeat the process for the other two Categories:

Haiku
21 Add the first Category:
Death is the cocoon; caterpillar to butterfly.
Iambic pentameter Metamorphosis.
22 Click New Item. She lifts her head. A tapping at the window is
only rain

© Jisc TechDis 2013 5 http://www.jisctechdis.ac.uk/xerte

 Assonance

I heard a whispering in my hearth, a sigh of

the coal; grown wistful of a former earth it
might recall.
Long dead shepherds mutter together, bringing
long dead sheep down for the night

26

27

27 To change the display order of categories first select the

26 If you were to make a mistake by adding an item to the
category and then use the up or down arrows bottom left of
wrong category or for another reason need to assign an item the editor window to move the category up or down.
to a different category simply select and drag the item to the
relevant category. N.B. You can also drag and drop items to
change their order within the same category although in the
category interaction the items are displayed randomly so in
this case the item order has little relevance.
However it may be useful to change the order in which the
categories themselves are displayed…

28
28 In this example we’ve moved Iambic pentameter below
the two other categories show it should appear as the far
right column…

© Jisc TechDis 2013 6 http://www.jisctechdis.ac.uk/xerte

23
Press Play to preview and navigate to the new category
page.

30
29

30 Now it’s much easier to read and analyse each verse and
to drag to the correct category…

29 With items of varying length it can be difficult to read

each item clearly. However the items can be positioned
around the screen before moving to the categories or even
within the categories and then swapped around before
checking answers…

© Jisc TechDis 2013 7 http://www.jisctechdis.ac.uk/xerte

 Recap
This Category Page Type is very similar to the Matching Pairs
page type at least in terms of the way the headings and items Notes
Make notes here to remind yourself and reflect on any ideas you had, or
are created. The matching pairs interaction is an option of the features you discovered, whilst working through this guide.
Timeline / Matching Pairs page type, so if you have completed
this particular tutorial step by step you should also find it
relatively easy to create pages with those interactions also.

View an interactive version of this tutorial and others at

www.jisctechdis.ac.uk/xerte

Tutorial created by Ron Mitchell mitchellmedia.co.uk for Jisc TechDis service – © Jisc TechDis 2013

© Jisc TechDis 2013 8 http://www.jisctechdis.ac.uk/xerte