In the Next-Gen UNLcms, the Builder Page will replace the Basic Page as your most commonly used page type. With it, you'll be able to build out complex designs using layout builder and a variety of built-in components. This page contains all the elements of an original Basic Page (title, text field, default hero options, page settings), as well as a "Layout" section that allows you to build out more advanced pages. After building sections and blocks in layout builder, you have the option of dragging and dropping them to different blocks on your page, as well as adding new blocks anywhere above or below existing blocks on the page.

Sections

In layout builder, the page is broken up into sections (also known as bands). To add a new section, make sure you're on the "Layout" tab of your Layout Builder page, then click the "+Add Section" link in the dashed box in the content area of the page. Upon clicking, a sidebar will pop out on the right side of the screen asking to choose a layout for that section (one, two, three, or four column). Once you've chosen the layout, the sidebar will change to configuration options for that section. You can change section configurations (other than column layout) at any time by simply rolling your mouse over that section in layout builder and clicking the "Configure X" link that shows up at the upper left. To entirely delete a section, click the "[X]" button that shows up to the left of the "Configure Title Block" when on hover.

Column Widths

By default, a single column will be 100%, while on two column you can choose between column widths of 50%/50%, 33%/67%, 67%/33%, 25%/75%, or 75%/25%. Three and four column layouts are split evenly (33% and 25% respectively) with default padding.

Section Heading

This is an optional field, and once added can be styled with a variety of section heading classes (see DCF Typography section for examples). The section heading classes are multi-select, so if you need a heading in both a certain style and for it to not appear when printing, for instance, you can choose both "dcf-txt-lowercase" and "dcf-d-none@print." Under the "Advanced" dropdown, you have the option of adding a section id, giving you the ability to anchor link anywhere on a page you're building.

Display options

These styles allow you to change the background, margin, padding, layout and vertical alignment of a section. More than one style can be applied to a section.

Background: Default (-None-), Scarlet, Dark Gray, Lighter Gray, and Lightest Gray

Background Patterns: Campus, Grit, Landmarks, Majors

Container: Standard Wrapper (dcf-wrapper) and Edge-to-edge (dcf-bleed)

Spacing: Remove default vertical spacing, Remove top spacing, Remove bottom spacing, Add extra top spacing, Add extra bottom spacing

Components

To add content, click the "+Add component" link in your newly-created section, and a dropdown will appear with a list to components to choose from, based on column layout you've chosen. Clicking the "More..." button will open a sidebar with access to more options including aggregated content and embedded webforms.

In a single column layout, you can add an aggregated display of News or Events, or a curated list of People (which will allow you to build directory listings).

Once a component is added, it can be edited by going to the "Layout" tab of the page, then rolling over that block. A small edit icon will appear in the upper right of the block, and clicking it will take you to configuration for it.

A list of components includes: