Rankings and steps
See non-standard items used on content pages to illustrate statistics and process steps.
Rankings component
Use rankings sparingly and make sure they are current, accurate and relevant to the page content. They can go out of date very quickly, so always check with colleagues before adding them to a page. If you can’t back up the information, don’t use it.
The component can be used on its own or as a group of two, three or four.
Key points
- Always check with colleagues in Digital before using a ranking component in the WCM. We need to ensure they are not used too regularly since they can quicky go out of date (this will be less of a problem and easier to manage in Drupal).
- Make sure the ranking or stat is correct and precise (for example, if it’s a joint first, use =).
- Put all the relevant info in the descriptor underneath the ranking or stat (for example, category, awarding body/source, year).
- Hyperlink the source.
- Ideally set a reminder to keep check back within a year in case the ranking needs updating or removing.
Rankings component without images
-
1st in the UK for American Studies (The Times and Sunday Times Good University Guide 2022)
-
5th in the UK for American Studies (The Guardian University Guide 2022)
-
=5th in the UK for Graduate Prospects – On Track in American Studies (Complete University Guide 2022)
-
12thin the UK for History of Art (The Times and Sunday Times Good University Guide 2022)
Rankings component with images
WinnerEntrepreneurship Catalyst Award (National Enterprise Educator Awards 2024)
WinnerSupporting Student and Graduate Employability Award (AGCAS Awards for Excellence 2024)
Winner
Career Prospects Award (Whatuni Student Choice Awards 2025)
Steps
The “Steps” component is used to outline a process a user needs to follow to achieve a goal – for example, applying for a course.
You need a good understanding of HTML code to correctly use this component.
-
First step header
Every step needs an h3 header and at least one line of body text that looks like this. Pressing enter while typing will add a step, so you'll need to edit the HTML if you want to add things such as lists or links.
- Testing ordered list
- Testing ordered list
- Testing unordered list
- Testing unordered list
-
Second step header
Every step needs at least one line of body text that looks like this. Within the code you can add sub headings.
Heading h4
-
Next step heading
You should have at least three steps if you’re using this component. Otherwise it’s not really necessary.