The Carousel is designed for use on landing pages and content pages. It displays a number of items within a scrollable carousel, each containing an image, caption and link through to a new page.

The Carousel can be used to highlight sub-sections of your site in a dynamic looking showcase, linking through to further information on each area.

The Carousel would work well for presenting research areas, projects, facilities, buildings, people, services and more.

Here is a live example

Take a look at how it works and then 'give it a try' by following the instructions below.

Give it a try

1. To add items to your Carousel, you'll need to add a hidden sub-section called Carousel (case sensitive) directly beneath the section where you'd like the Carousel to appear (it's a hidden repository folder and so the 'Show in navigation' option needs to be unticked).

Screen grab

2. Add a second hidden sub-section below your new Carousel sub-section. You can name this sub-section as you wish. In my example I've called the sub-section: Flowers.

3. Add a Carousel item content type to your second sub-section, (Find out how to add a content type to a section), for each Carousel slide.

Carousel item form fields

Field titleWhat should I do?Is it compulsory?
Name* This is the behind-the-scenes name, only visible to editors of the section Yes
Image* Add you image using the image crop tool. Minimum image size 194 x 167 pixels. Add a description of the image in the Alt text: field Yes
Internal Link Either click Select and navigate to the T4 page you want to link to. YOU MUST ADD A LINK or this item won't display Yes
External Link Or copy and paste an external URL into this field. External links must start with http:// or https:// Yes
Media Library Link Or add a document (pdf, Word, Powerpoint etc.,) from the Media Library No
Item Title* This appears underneath the image Yes
Information* This appears on the reverse of the item when you 'mouse over'. Yes
Display item?* This defaults to yes Yes

Once you have created all your Carousel items...

4. Add a Carousel widget content type to the page where you want the Carousel to appear. (Find out how to add a content type to a section).

5. Fill in the options (see table below). Name, Block title, Summary.

6. Find items. Use the Select option to tell the widget where you've put its Carousel items. In my example above I put the items in the sub-section of Carousel called Flowers. See screen grab above.

Carousel widget form fields:

Field titleWhat should I do?Is it compulsory?
Name* This is the behind-the-scenes name, only visible to editors of the section Yes
Block title* This title will be shown above the entire block, if switched on with the field below. Otherwise it will be an 'invisible' screenreader only heading and will ensure your page has and H2 Yes
Show block title Ticking this box will make the heading show to all users, not just screenreaders. No
Summary Enter a summary/introduction for your Carousel. It appears beneath the block title No
Find items* Point to the sub-folder where your Carousel items live. Yes
Display items* Defaults to Yes. Yes

7. Click Update & Approve to save