This article is about how to create a new page (or customize a template) using the Page Builder tool. To read about the Page Builder in general, see this article.

To choose an existing page template or to create a new page from scratch:

1. Go to the Settings section of the admin website.
2. Enter the Portal Management module.
3. Select the portal.
4. Click on "Page Builder" under the CONTENT section on the left menu column.

You are now on the Page Builder manager. Listed in the table, you can view all pages that currently exist in the portal:

1. The actions menu allows you to view, edit, copy, delete, and export the page (exporting is convenient for importing a page to other portals without having to recreate it).
2. The title, which contains two versions: a user-facing title and an admin-facing title. Admin-facing titles can help with internal organization; for instance, if you have several pages designed for weight management, with one page being more basic than another, the admin-facing titles might be “Weight management 1” and “Weight management 2.”
3. Keywords, which also contain a user-facing and admin-facing version.
4. Type indicates whether the page is custom, which means it is listed in the table as a singular page, or a template page, which means it will appear in the template catalog for the portal (where the system template pages appear, which we’ll discuss below).
5. Last published shows the date of the most recent published version of the page.
6. Status is either draft, which means it is not yet published and cannot be used yet, and published, which means it can be used.

To create a new page, click on the CREATE button above the Page Manager table:

Creating a New Page

In creating a new page from a blank template, you want to choose either the Blank Public Page or the Blank Member Page tile. The difference between these two options is that the Blank Public Page can be used to send to anyone (regardless of whether they are a member or logged in) and they do not contain any components that require someone to be logged in--challenges, care paths, group programs are all omitted for Public Pages. 

Once you have chosen between these tiles, click on the CREATE NEW button in the upper-right corner. Now you are in the page-builder tool. (All other tiles are system templates that contain preconfigured topic- or theme-based sections; 

If you want to read about the system page templates, see this article.)

Note: You can make it a template page by clicking the "Template" box on the right, beneath the CREATE NEW button. This will make the page appear in the template catalog when you first choose to create a page and enables easy access and editing of a previously created, foundational page.

The page builder is divided into three main parts:

1. Sections—this contains the different section types, interactions, and components which are the building blocks of the page.
2. The drag-and-drop field—this is where you build the page by adding the sections. 
3. The Page Settings fields—this is where you configure settings and styles for sections, components, and the page itself.

Enter the Page Settings

The first thing to do when you're creating a new page is to set a page title and other page details, which will appear in the table so you can identify the page's purpose.

For internal use, fill in the Admin Facing fields:

1. Choose the title for your page.
2. Enter a short summary for the page; this appears on the page tile after it's been saved.
3. Enter the description for the page; the description is generally more detailed than the summary and explains what the page is meant to be used for.
4. Enter a keyword for the page.
5. Upload a thumbnail image for the page (jpg or png are accepted, ideally 300x200).

You can also fill in User Facing fields which is especially important if you will use this page within another page. In other words, you can add another page's tile to a page which the member will see when they view the page. This page tile will be populated with the information you put in the User Facing fields, including the title, the description, the keywords, and the image.

After editing the page's basic settings, it's time to build the page. The first step is to choose a section, as all pages must contain at least one.

Types of sections to choose from:

1. Component section—This is the most general section type, in which you can add any of the component options as a single tile by drag-and-dropping them from the components field on the left. All tiles added here represent a single piece of content or a single action, making the process of populating this section slightly different from the other section types. 
2. Custom section—You can create a section from scratch.
3. Content section—This section can be used to show up to 100 tiles of individual content pieces from the library. 
4. Course section—This section can be used to show up to 100 individual course tiles.
5. Tracker section—This section can be used to show up to 100 individual tracker tiles.
6. Challenge section—This section can be used to show up to 100 individual challenge tiles.
7. Group Program section—This section can be used to show up to 100 individual group program tiles. 

Note that, at any time during the construction or editing of a page, you can rearrange sections using the up and down buttons, delete sections, or copy sections in the top-right corner of the section header. When you are starting with a new blank page, it automatically contains a component section:

Adding and Configuring Sections

You can either begin by populating the default component section, or you can delete it and add a different section type. We'll start by adding some basic interaction tiles to the component section. The component section is the wild-card section, as it can contain any number of different interaction component types in the arrangement of your choosing. To add an interaction component, simply drag-and-drop it from the left to the builder field: 

The Components List

• To-Do’s—Displays the member's list of to-do's.
• Goals—Displays the member's short- and long-term goals.
• Wellness Vision—Displays the member's wellness vision.
• Page—Displays a tile that links to another page.
• Flow—Displays a tile that, when clicked by the user, takes the member to a specific flow that you select.
• Content—Displays content  that you select from the content library that the member can read, listen to, or watch on the page.
• Tracker—Displays an interactive tracker tile,
• Course—Displays a specific course tile.
• Redirect—Displays a tile that redirects the member to the selected destination: course catalog, specific course, specific flow, specific page, goal reminder center, personal journal, member dashboard, portal home, trackers dashboard, or inserted URL.
• Call-to-Action—Displays a tile that greets the member and provides a button that links to the portal's configured Care Path flow (configured in the portal's general settings) OR, if a course has been started by the member, the button links to the course page. 
• BMI Calculator—Displays the BMI calculator.
• Calorie Calculator—Displays the calorie calculator.

Configuring Non-Component Sections

Determining what displays in all sections other than the component section works differently--this applies to custom, content, course, tracker, challenge, group program, and care path section. Once you select any of these section types, you can choose what to display using the setting editor on the right. 

For these sections, you can display up to 100 tiles by choosing the amount in the display field. These tiles are interactive for members; for instance, a member can review a course outline, start a course, and continue from a course tile; trackers can be used from a tile; and content can be read, watched, or listened to from a tile.

You can populate courses, content, and trackers based on associated keywords by entering them into the keyword field and you display them based on one of four rules:

1. By Activity (the most recently used/accessed by the member will be listed first)
2. Alphabetic ascending
3. Alphabetic descending
4. Date added ascending
5. Date added descending

Let's look at an example:

In this image, you can see that a course section has been added. The section has been stylized by making the header blue with a background image. Further, the section has been configured to show up to 22 tiles for courses, with no keywords assigned, arranging the course-tiles based on the member's most recent activityl:

1. In the style editor, the color blue was chosen and an image was added: both of these can be seen in the section's header.
2. The display limit has been set to 22, which means up to 22 course tiles will be displayed here.
3. The order in which the course tiles are displayed has been set as "date added, descending." You can also choose to display tiles by most recent activity, or alphabetically.

After choosing the section(s) you want on the page, configurations on the section can be done by clicking the header, which opens the section editor on the right.

Here, you can make stylistic edits for the header:

• Enter a title for the section.
• Choose a background color for the header.
• You can also upload a background picture, if you choose, to display in the header.

When you have added all the sections you want, click Save Drat and Publish at the top-right of the page: