Cornerstone Overview

What Is Cornerstone?

As the name suggests, Cornerstone is the foundation to your site building experience and includes a Layout Builder, Header Builder, Content Builder, Footer Builder, and Grid Editor.

X users must install Cornerstone as a separate plugin and have access to the Content Builder (sometimes referred to as the Page Builder). Pro users have Cornerstone built into the theme and have access to everything.

Each builder gives you the ability to create different parts of a website in a visual, drag-and-drop manner, even if you have no coding experience. This is achieved through various Elements and customization options.

Builder Types

Cornerstone includes a total of four website builders plus a special Grid Editor. Let's discuss each one.

• Content Builder: This builder is used to create the main content of pages throughout your site. It also works on posts. To access in X, go to WordPress Dashboard → X → Cornerstone. To access in Pro, go to WordPress Dashboard → Pro → Content.
• Layout Builder: (Pro only) This builder is used to create the layouts of the website (overall templates assigned to various contexts like blog posts, single pages, archives, et cetera). Go to WordPress Dashboard → Pro → Layouts to access the Layout Builder.
• Header Builder: (Pro only) This builder is used to create the header of the website. Go to WordPress Dashboard → Pro → Headers to access the Header Builder.
• Footer Builder: (Pro only) This builder is used to create the footer of the website. Go to WordPress Dashboard → Pro → Footers to access the Footer Builder.
• Grid Editor (Pro only) While not technically a builder, Pro users also have access to a powerful Grid Element.

How to Access Global Settings

To access the settings of the builders in both X and Pro go to WordPress → X / Pro → Settings. The settings available are as follows:

• Custom Path: Use this option to set the URL path parent portion when accessing the builder interface. The default path is x in the Cornerstone in the X theme and the default path for the Content Builder of the Pro theme is pro.
• Hide Access Path: If enabled, the logged out visitors will encounter the 404 not found page instead of being redirected to the login screen.
• Show Legacy Shortcode Generator: The legacy shortcode generator is the old way of adding the shortcodes using the standard WordPress editor by adding a new button to the editor. This method is deprecated and the new set of the elements are not using the shortcodes and this method will not work for them.
• Permissions: The Permissions section is a dedicated set of controls which allows you to hide or show Cornerstone for different user roles and post types. Learn more about Permissions.
• System - Clear Style Cache: For quicker page load time, Elements of the builders will remember the CSS generated when they were last saved. This is automatically cleared when Cornerstone is updated. It may be useful to clear manually if any Elements are missing styling.

Colors

You can use the Color Manager to set unlimited colors which you will be able to use throughout your website. To access the Color Manager:

1. Go to X / Pro in the WordPress admin and launch Cornerstone by selecting any Builder (Content, Headers, Footers, et cetera). Alternately, launch a Builder using the WordPress admin bar on the frontend of your site.
2. Click the navigation icon (☰) in the toolbar.
3. Select Colors in the main Navigation dropdown.

There you can add new colors or edit the existing colors and save them to use later. Learn more about the Color Manager.

Fonts

You can use the Font Manager in X and Pro to set unlimited fonts which you will be able to use throughout your website. To access the Font Manager:

1. Go to X / Pro in the WordPress admin and launch Cornerstone by selecting any Builder (Content, Headers, Footers, et cetera). Alternately, launch a Builder using the WordPress admin bar on the frontend of your site.
2. Click the navigation icon (☰) in the toolbar.
3. Select Fonts in the main Navigation dropdown.

There you can add new fonts and save them to use later. This includes System Fonts, Google Fonts, Adobe Fonts, and Custom Fonts. Learn more about the Font Manager.

Templates

The Templates are the ultimate solution to reuse already created content using Cornerstone. You can access the Template Manager by going to WordPress Dashboard → X / Pro → Templates. There you will have a list of saved templates.

Learn more about the Template Manager including how to create a template.

Global Blocks

The Global Blocks are used to have a one place control over the content that you create. You can add a Global Block which will use the same graphical user interface of the builder, and then you can use that Global Blocks throughout the website using the Global Block Element or the generated shortcode. Whenever it comes the time to edit or change the block, you can do the change from one place and the change will be broadcast to all the instances that you use on the website.

Go to WordPress Dashboard → X / Pro → Global Blocks to access the Global Blocks controls. Learn more about Global Blocks.

Video Tutorial

Follow along for a detailed tour of the entire Cornerstone experience.

Summary

Cornerstone is the heart and sould of your website building experience. We've discussed what it is, how it works, and some of the amazing features at your disposal. A great way to get up and running with Cornerstone is to use one of the included Starter Templates or Design Cloud.