Listing Blocks
Intermediate Training Module 3: Cards & Listings
Listing blocks allow you to automatically display categorized content throughout your website in a simple, easy-to-scan format. Unlike Card Blocks, which prioritize images and visual presentation, Listing Blocks focus on content and readability.
Listings are especially useful when visitors need to browse larger amounts of information quickly.
Listing blocks can display:
- News Posts
- Events
- People Profiles
- Files
- Pages
- Descriptions (FAQs/Accordions)
Because listings pull content dynamically, they update automatically whenever new categorized content is added.
Listings vs Cards
Before choosing a block, it is important to understand the difference between the two display styles.
Card Blocks
Card blocks display content in visually rich cards that often include:
- Images
- Titles
- Excerpts
- Additional metadata
Card layouts work well when visual presentation is important.
Examples include:
- Featured news
- Event promotions
- Staff directories
- Video galleries
Listing Blocks
Listing blocks display content in a simple list format.
Listings work well when:
- Large amounts of content need to be displayed
- Visitors are searching for information quickly
- Images are less important
- Space on the page is limited
Examples include:
- News feeds
- Event listings
- File libraries
- FAQ collections
How Listing Blocks Work
Every listing block follows the same workflow:
Step 1: Create Content
Create content such as:
- Posts
- Events
- People Profiles
- Files
- Descriptions
Step 2: Categorize Content
Assign one or more categories.
Examples:
- Research
- Students
- Faculty
- Accessibility
Step 3: Add a Listing Block
Insert the appropriate Listing Block onto a page.
Step 4: Filter the Content
Choose:
- Categories
- Number of items
- Sort order
- Display options
The block automatically builds the listing.
Adding a Listing Block
To add a Listing Block:
- Click the + button.
- Search for the desired listing block.
- Select the block.
Available listing blocks include:
- News Listing
- Event Listing
- People Listing
- File Listing
- Page Listing
- Description Listing
Common Listing Settings
Most listing blocks include several shared options.
Title
Display a heading above the listing.
Examples:
- Latest News
- Upcoming Events
- Frequently Asked Questions
Background Colour
Most listings support:
- White background
- Grey background
Use background colour to help distinguish sections on longer pages.
Number of Items
Control how many items are displayed.
Examples:
- 3 items
- 5 items
- 10 items
Categories
Limit results to one or more categories.
For example:
- Research
- Research + Awards
This allows the same content type to be displayed differently across multiple pages.
More Button
Most listing blocks support additional navigation options.
- Load More
Displays additional content directly on the page. - View More
Links visitors to a dedicated archive page.
Choosing the Right Listing Block
News Listing
Best for:
- News articles
- Announcements
- Stories
Often includes:
- Dates
- Excerpts
- Featured images (optional)
Event Listing
Best for:
- Upcoming events
- Workshops
- Conferences
- Information sessions
Can display:
- Event date
- Event time
- Event location
People Listing
Best for:
- Staff directories
- Faculty listings
- Team pages
Can display:
- Photo
- Job title
- Phone number
File Listing
Best for:
- Downloadable resources
- Reports
- Policies
- Forms
Often supports:
- Sorting
- Date modified
- Categories
Page Listing
Best for:
- Resource hubs
- Service directories
- Related content
Can display:
- Excerpts
- Updated dates
- Categorized pages
Description Listing
Best for:
- FAQs
- Accordions
- Help content
Depending on configuration, descriptions may display as:
- Lists
- Columns
- Accordions
Best Practices
Start with Categories
Well-organized categories are the key to useful listings.
Display Only Relevant Content
Avoid listing everything simply because you can. Focus on the content most relevant to the page.
Use Listings for Large Collections
If you’re displaying many items, listings are often easier to scan than cards.
Keep Sections Focused
A page should have a clear purpose. Avoid creating large mixed-content listings without a meaningful filter.
Let Listings Update Automatically
Create content once and allow listings to manage the display. This reduces maintenance and keeps content current.
-
Welcome to cutheme Advanced Training, Module 2. In this video we will cover listing blocks.
Listing blocks are handy for listing content all in one place. They can be used for descriptions, events, files, news, pages, or people.
In this video I will quickly go over the options for each type.
First, to add a listing block, click the blue plus to open up the block selection menu.
Scroll Down to “Stacked Lists”, and I’m going to start with a News Listing.
Close the menu, and now you can see you have your news listing here.
All options for the block will be on the right.
For News Listings, you can add a block header, some intro text, change the background between white and grey, and choose between 1 or 2 columns.
For the new posts themselves, you can show images, dates, and excerpts from the news article. You can also choose the number of posts.
The default is 6. You can go between 1 and 12, and at the bottom you can choose to have a “more” button.
The default is none, but you can also have a button that will load more articles so you’ll stay on the same page, and more articles will be loaded, or you can view more where it will redirect you to another page with all the links.
You can add that page in the view more link here.
Lastly, for categories, you can filter between the different categories your site has, to only have those specific new articles in the listing.
I am going to delete this block and go to another type of listing, the event listing. Event listings list different events that your page promotes.
Like the News Listings, for Event Listings you can add a header, change the background, and choose the number of columns. You can choose the number of events, and sort by either upcoming, or past.
There is also a “more” button and categories, just like for news listings.
After that, we have File Listings. File listings list all the files on your site. File listings have a lot of the same options as before, with some new options. You can choose to show all files, which will show every single file on your site.
You can also choose a custom number of files, and list them either from A-Z or Z-A. You can also list your files by modified date, from oldest to newest, or newest to oldest. And just like the others, you can choose tohave a more button, and filter by category.
Next are page listings, which list all the pages on your site. It’s similar to the others, you can add a header, change the background, choose column layout, and you can toggle between dates and excerpts.
There is also an option to show all pages like there was for files, and you can sort them either alphabetically or by date.
Next up are People Listings, which list all the people added to your site. People Listings offer the most customization of any listing block. Aside from all the features talked about before, you can toggle their images, job titles, emails, and phone numbers.
Then, the last type of listing block are Description Lists. These list all the descriptions on your site, and they are quite simple.
You can add a header and change the background color, and you can also choose the layout type as, either stacked, columns, or accordion.
And that’s a little walkthrough of all the types of listing blocks on cutheme.
Try it Out!
- Create a category called Research.
- Add several categorized content items.
- Insert a News Listing block.
- Configure it to display only Research content.
- Experiment with item counts and display options.
- Add an Event Listing and compare the available settings.