Working with Page Layouts: Patterns
Modified on: Tue, Feb 27 2024 11:40 AMWe've added Patterns to our toolbox to help content managers create consistent page layouts and features. Patterns are templates or features like banners, buttons, accordions, and tabs. A big advantage of using patterns is that the padding and space settings are mainly done for you. This means that your website will be usable on desktops, tablets, and mobiles.
- Click the Block Inserter.
- Click the Pattern Library block.
- You should see Pattern choices in a popup modal window.
For a larger image, right-click and select Open Image in New Tab
For a larger image, right-click and select Open Image in New Tab
On the popup modal window, you should see twelve patterns: banners, page layouts, sections, and basic features, including accordions, tabs, and buttons. Typically, pages are designed from the top down. With this in mind, we can list the order of how the patterns should be used.
Banner
Patterns prefaced with "Banner -" are usually positioned at the top of the page and used for the page title to replace the default page title. Listed in order from simple to more complex, our current banners include:
- Banner - Page Title and Summary
- Banner - Page Title with Buttons
- Banner - Page Title with Image and Buttons
- Banner - Small Page Title with Background Image and Buttons
- Banner - Large Page Title with Background Image and Buttons
Page Layout
Patterns prefaced with "Page Layout -" are inserted after you choose the Banner block.
- Page Layout - Full-Width Text
- Page Layout - With Custom Sidebar
Sections
- Section - Team
- Section - Four Column
Misc
- Accordions
- Tabs
- Button