Standardizing Content Display Layouts

Display page templates are specialized templates for presenting content at dedicated URLs in your website. When you create or upload a new content item, Liferay automatically generates a friendly URL for accessing it. To render the content at this URL with a consistent structure, you must implement a display page template for it.

In addition to rendering individual content items, modern web solutions often need to display groups of items organized by different criteria. Liferay provides collections and a collection display fragment to achieve this goal. In this lesson, you’ll learn how display page templates work, how they integrate with collections, and how they compare with other templates you’ve learned about. With this knowledge, you can standardize layouts for displaying different types of content in Liferay.

Understanding Display Page Templates

In the previous lesson, you learned about using web content templates to style and format structured web content. However, structured web content is only one of many content types supported by Liferay. Other types include system entities like documents, media, blogs, and categories, along with custom entities created with Liferay objects. To establish a cohesive visual identity for your digital experience, the dedicated URLs for each of these content types require standardized layouts defined by display page templates.

The first step in creating a display page template is to assign a content type to it. Only content items of the assigned type can use the template for rendering their display pages. After you assign the content type, you can design the display page template as you would a regular page or page template. With modular components like fragments and widgets, you can build dynamic layouts that map to content fields and enhance those layouts with additional elements and functionality.

You can design multiple display page templates for a single content type. Although only one of these can be set as the default template, you can manually assign alternate templates to individual content items. With this flexibility, you can dynamically render content based on site context, user interactions, or metadata. Display page templates also include the option to configure settings for search engine optimization (SEO) and Open Graph, giving you additional control over how users can find and interact with display pages.

Display pages are most commonly used in scenarios where a user has requested a full detailed view of an item. For example, a website landing page might contain a list of several article titles, where clicking one of the titles would direct you to a display page that renders the full article. While display page templates control the rendering for individual articles, the landing page might leverage a different feature: collections.

Displaying Content Collections

Liferay collections are sets of content items that you can use to group and filter information. Collections can be populated manually or dynamically by defining selection criteria for content items. Liferay provides a collection display fragment to configure how collections are rendered. You can add collection displays to page templates as you would any other fragment. The collection display fragment complements the display page template by providing the ability to render groups of content items, each of which has its own individual display page.

Best Practices for Standardizing Layouts

Display page templates have a significant overlap in functionality with two other templates covered in this course: page templates and web content templates. To design your site pages properly, it’s important to understand the similarities and differences among these Liferay templates.

Both page templates and display page templates define the layout for an entire page. However, page templates are agnostic of the type of content being presented, while display page templates are designed to render a specific type of content at a dedicated URL. This distinction informs how you should use both templates to design your site. A common application that Clarity may implement is an e-commerce product listing. You can use display page templates to render individual product details, while page templates that leverage the collection display fragment would be more appropriate for overarching category pages that aren’t tied to specific products.

Both web content templates and display page templates are tied to individual content types. However, web content templates are limited to rendering only structured web content. They are appropriate if your primary concern is the styling and formatting of web content, without the need to design alternate layouts for different site contexts. Display page templates can be configured to render structured web content as well, but they also extend to several other system entities, along with custom objects. This versatility makes display page templates the recommended choice for designing content-specific displays in Liferay.

Conclusion

With display page templates, you can standardize content display layouts for content at dedicated URLs. Used together with collections and the collection display fragment, display page templates help you establish structural rules for presenting content items of different types and groupings. Clarity already uses display page templates throughout its website to display product details. As they scale their solution to provide distributor-specific content, they want to provide a ticketing system for managing support requests. With display page templates, they can ensure that all dedicated ticket pages have a uniform layout and style.

Next, you’ll take a look at Liferay’s templating functionality for rendering widgets.