1. What is a vertical content list?

Vertical content lists are used to automatically list node pages, such as projects or articles, on panel pages. Pages can be displayed in a variety of ways.

See a vertical content list

Use vertical content lists when:

  • you want to automatically list pages of a particular type on a panel page in date or alphabetic order.

Vertical content lists shouldn't be used when:

  • you want to curate which items are displayed or set a specific order
  • you want to list content from another site
  • you want to list panel pages.
Top of page

2. How to create a vertical content list

Vertical content lists can be created by:

  • site builders.

Use the in-place editor to create a vertical content list:

  1. Click 'Customize this page' in the black Drupal menu at the bottom of the page, and then click the plus icon (+) in the blue box at the top of the page.
  2. Select 'View panes' from the side menu. You can then filter items in the list by typing 'vertical' into the 'Quick filter' box.
  3. Select your desired display option.
  4. If you want to filter your list using a taxonomy term, enter a taxonomy term ID in the 'Content: Has taxonomy term ID (with depth)' field.
  5. If more than 10 items will be displayed in your list, tick the 'Use pager' box.
  6. Enter the number of items you want to display in your list in the 'Num items' field.
  7. Select the content types you want to display in the list. Hold down 'Ctrl' on your keyboard and click to select multiple content types.
  8. Select a sorting option from the 'Sort by' drop-down menu.
  9. Click 'Finish' to add the vertical content list to the panel page.
  10. Apply a section style to the panel to finalise the layout.
  11. Click 'Save' in the black Drupal menu at the bottom of the page to publish the changes.
Top of page

3. How to edit a vertical content list

Vertical content lists can be edited by:

  • editors
  • site coordinators
  • site builders.

To edit a vertical content list, follow the instructions for editing panels on panel pages.

Top of page

4. Display options

There are several display options for vertical content lists. Each option uses a different view mode to display your content:

  • Vertical content list: Card displays content using cards.
  • Vertical content list: Card compact displays content using compact cards.
  • Vertical content list: Card Horizontal displays content using horizontal cards.
  • Vertical content list: Compact displays content in a vertical list using small teaser images.
  • Vertical content list: Teaser displays content in a vertical list using larger teaser images.
  • Vertical content list: Teaser 2 Column displays content in two vertical columns using larger teaser images.
Top of page

5. Best practice

  • Use taxonomy terms to group articles and events into related categories. You can then use the taxonomy term ID to control which items appear in your vertical content lists.
  • Limit lists to 6 or 9 items per page when using Card or Card compact displays.
  • Limit lists to 1 item when using the Card Horizontal display.
Top of page

7. Fields

Complete all required fields and as many optional fields as possible to provide the best user experience.

All display options except Vertical content list: Card Horizontal

Field name

Required field?

Notes

Content: Has taxonomy term ID (with depth)

No

Filters pages using the specified taxonomy term ID number.

Use pager

No

If more than the 'Num items' value are included in your list, ticking this box displays pagination to access additional pages. Pagination can be configured using the following options:

  • page by date
  • display all items
  • display a specified number of items
  • paged output, full pager
  • paged output, mini pager.

Pager ID

No

Default pagination page to display when the page loads.

Num items

No

Determines the number of pages that will appear in your list. Default option is 9 or 10 items, depending on the display option selected.

Offset

No

Skips a defined number of pages before selecting the first page that will be displayed in the list. Default option is 0.

Type

No

Determines the type of content that will be displayed.

Sort by

No

Displays pages by title, date or surname.

Order

No

Displays the pages in your list in ascending or descending order

Vertical content list: Card Horizontal

Field name

Required?

Notes

Content: Has taxonomy term ID (with depth)

No

Filters pages using the specified taxonomy term ID number.

Offset

No

Skips a defined number of pages before selecting the first page that will be displayed in the list. Default option is 0.

Type

No

Determines the type of content that will be displayed.

Sort by

No

Displays pages by title, date or surname.

Order

No

Displays the pages in your list in ascending or descending order

Top of page