All templates have a built-in design for collection pages that determines how content displays. For example, many Blog Pages have a classic layout where posts display in a horizontal list. To create a layout beyond what your template offers, use a Summary Block.
This guide will show you how to use a Summary Block to display existing content from a collection page. We’ll use a Blog Page as an example, but you can use any type of collection page except Album Pages.
Before you begin
Summary Block layout options
Summary Blocks pull content from collections and display it on other areas of your site. In this example, we’ll use a Regular Page.
Summary Blocks display up to 30 items and have four layout options:
- Wall - A popular option that displays content in a masonry, mosaic-like layout
- Carousel - Displays content in a slideshow format, helping visitors interact with your collection
- List - Displays content in a linear design with thumbnail images on one side and text on the other
- Grid - A popular option that displays content in an even grid, which lets you recreate built-in collection designs from some templates like Flatiron and Avenue
Step 1 - Move your collection to Not Linked
To hide the original collection page from your navigation menus, drag it to your Not Linked section. This allows the Summary Block to pull items from the page without visitors seeing duplicate content. For detailed instructions, visit Moving pages around your navigation.
Once the page is in Not Linked, you’ll continue to add new content here, like blog posts or products, which will display in the Summary Block you’re going to build.
Note: Don’t delete this page. Moving it to Not Linked hides it from visitors, but still allows it to feed content to your Summary Block.
Step 2 - Create a Regular Page
Now that the original collection page is hidden from your navigation, you’ll create a Regular Page in your Main Navigation as a substitute so visitors can find your collection content.
This is the page that will display your collection items to visitors. Once you set up this page, it updates automatically every time you update the hidden collection page.
Note: Give the new page the same name as the original collection page.
Step 3 - Add a Summary Block
Now that you substituted a Regular Page for the original collection page in your site’s navigation, add a Summary Block to display collection content.
First, follow the steps in Summary Block overview to add the Summary Block and select your layout.
In the Content tab of the Summary Block Editor, select the collection page you moved to Not Linked in Step 1.
We set the example Summary Block in our screenshot to highlight blog posts from the Blog Page "Blog”.
Step 4 - Customize the Summary Block
After you add the Summary Block, you can filter the content that displays based on specific criteria. For example, you can customize the number of items that display, tags and categories, and what primary information displays (like item title, thumbnail, and excerpt). You can also switch between designs if you want a different layout.