Layout Builder Overview
In this article, we're going to discuss Cornerstone's Layout Builder and how it can be used to open up incredible design possibilities on your site.
The Layout Builder is a powerful tool that opens up a wide range of possibilities for developers and designers. “Layouts” in Cornerstone's page-building parlance refers to any asset that requires an assignment to be output globally or to a specific context for it to be viewable on the frontend of your site. This includes:
- Single Templates (i.e. standard page, blog post)
- Archive Templates (i.e. blog index, custom post type archive)
- WooCommerce Single (i.e. Product pages)
- WooCommerce Archive (i.e. Shop index, Product category archives)
These layouts are designed once, and then repeated across the context in which they are assigned.
Take your site's blog for example—say you're viewing the blog index and you click on a post to view its content. Clicking on that index entry takes you to your theme's “single post” template, which is an overall design repeated for all posts that specifies the physical locations where certain dynamic, database driven information should be output (e.g. title, publication date, main content, et cetera).
To begin working with the Layout Builder, click on the plus sign (+) in the top bar to reveal the New Document pane. From here, you can select any of the layout types mentioned above to get started:
Upon clicking “Create,” a new document of the type you selected will be added to your site and a tab will be opened for you to begin working:
To rename your document, you can double-click in the workspace header title or go to the Settings tab found on the Outline pane. Once finished, clicking the Save button will apply your changes:
Don't forget that layouts require an assignment to actually start seeing your content on the frontend. This can also be administered from the Settings tab:
To learn more about the process for getting up and running in each part of the Layout Builder, check out these resources:
We've put together step-by-step tutorials on using Archive Templates, Single Templates, Headers, and Footers within the Layout Builder, so we definitely recommend checking those out! We also routinely add new videos to our YouTube Channel so be sure to subscribe to get the latest.
We've covered an introduction to the Layout Builder, how to design and assign layouts, in addition to video tutorials so you can see it in person. We hope you enjoy this powerful addition to Cornerstone!
See something inaccurate? Let us know