A design template, which you can think of as a blueprint, is a special section that provides reusable predefined layouts and regions. When creating new sections, developers can specify that the section should use a particular design template. Then, in their instance of the template, developers can map controls into regions specified by the template.

Design templates for sections represent common user interface patterns. Using design templates for sections helps you build a consistent user interface for your application and reduces development time—you define a template once and use it across your application. Design templates simplify making bulk layout changes, as changes to the template will be reflected in all the sections that use the template. In addition, design templates provide a common language between designers and developers. For example, when a designer requests use of the "Card with image and metadata" template, developers understand what that means.

Pega offers the following design templates for sections, which are reusable layouts for common component areas in your application:

Design template	Purpose
	Shows an image, description, and/or action when no results are returned in a list or container. Requires at least an image, a description, or an action, but can contain all items.
	Shows a standalone item or list item with its related data. Requires a title. Optionally includes metadata or an image.
	Shows the assigned owner for a piece of work. Requires a title and assignment. Optionally includes metadata.
	Shows a list item in a repeating dynamic layout that does not include actions. Requires a title. Optionally includes an image or item status.
	Shows a list item in a repeating dynamic layout that can contain actions. Requires a title. Optionally includes actions, metadata, or an image.
	For pages with both primary and secondary data, shows the layout for the entire page, with a main region and a secondary region.

For example, the following screenshot shows the section pyMiniPartyDetails, which uses the List item with image, metadata, and actions template. The developer mapped controls into each region.

Using the UI inspector at run time, you can see the section with controls mapped into the regions defined by the template:

Applying a design template for a section

To apply a design template for a section, complete the following steps:

1. Create a section by clicking +Create > User Interface > Section.
2. Fill out the Section form:
   1. In the Label field, enter a descriptive name for the section.
   2. Select the Create Section using a Design Template check box.
   3. In the Apply to field, press the Down Arrow key to specify the Applies to class.
   4. In the Add to ruleset fields, verify that the ruleset and ruleset version are correct for the section.
   5. Click Create and open.
3. On the Design tab of the Section form, click the Change button.
4. In the Select a template dialog box, click a design template for inner sections to select it.
5. On the Section form, specify the elements needed for the template, such as a title and image, and click Save.
6. Drag elements such as controls and images into the appropriate regions of the section and save your work.

For an introduction to using design templates, see Designing sections by using design templates.