Dividing the Middle Area of a Page into Three Panes

In this card, you will be working in the center facet of Decorative Box, which will contain everything on the page that is in between the top and bottom content areas.

First you will set up the center facet of Decorative Box to house three panes: left, center, right. To do this, you will add two nested Panel Splitter components to create three horizontal splitter panes:

Visual editor, 3 horizontal panes

Then you will add a Panel Accordion component into the left pane, and a Panel List component into the right pane:

Visual editor page, left and right panes

Before adding contents into the center pane, first you will a insert a Decorative Box into the center pane. Then you will add Bread Crumbs into the top facet of the nested Decorative Box:

Visual editor, breadcrumbs in decorative box