A Card row is a collection of cards which allow you to preview and share content but also discover more information without leaving the page you’re on.

Overview

An example of a Card row
An example of a Card row

They promote deeper exploration of our site and also allow us to easily signpost content that might be of interest to our users. 

Whilst there is a maximum of four across in a card row, there isn’t a limit on the number of cards you can display down a page, so you could theoretically create a page where they're the dominant feature - for example, showing event listings. However, in general terms it's best to keep the number of cards down to a concise few which enhance the user's experience rather than diverting their attention from the journey you want them to take. 

A card row is made up of three constituent parts:

    1. Reference Title – which is an internally searchable title and isn’t displayed
    2. Title and intro text – which is rendered on the page once the component is published
    3. Card links – these are the links that will be displayed on the page.

In Contensis, the card row shown above looks like this:

A card row in the backend of Contensis.

Creating or editing a card row is a case of adding, removing or changing the order of website entries to create the further navigation that you wish to show the user. 

  • The "Title and intro text" works like a regular text box but be aware that the title should use ‘Style: Heading 2’. It looks like this:
Card row title and intro text.

Card links can be added by clicking the green ‘+Add more’ button and can include event cards, content pages, courses and more. When selected, courses will render with honour type, award level and start dates.

The image below shows the options of the content types you can add using the drop-down filter...

Card row content type options

Card entries can be moved, duplicated or deleted by clicking the three dots on the right hand side of each card entry. Alternatively, cards can be moved by click and holding on a card entry and dragging it up or down.

Clicking on the pencil icon on the right of the entry will allow you to edit the existing content. 

The edit options in a card row
These are the options when you click on the three buttons. Clicking on the pencil icon takes you into the entry to edit it.

When you are happy with your card row, you can then publish it. 

Component in action

A single card row can be added to multiple pages once it is created, but if you edit it in one place those edits will appear across the website. You can find a Card row in action here