Content Areas and Content Blocks

Content Area's and the Content Blocks within them are the essential building blocks of your site. The easiest way to remember it is: Content Blocks go in Content Areas, as seen in the diagram below.

Turning On Design Mode

Turning On Design Mode

In order to make changes while working with content areas from your storefront, you will need to enable design mode.

To turn on design mode, click on the three bars on the upper left side of the screen, a drop down menu will appear then click on "Design Mode"

Content Areas

Content Areas

Content Areas are essentially boxes that hold the images, menus, sign up boxes and social media icons you see on the page, or as we call them, Content Blocks.

You can view all the Content Area's on a page by turning on Design Mode. As you will see in the image above, all of the Content Area's are listed in the black box at the bottom of the page.

Content Blocks

Content Blocks

As stated earlier, Content Blocks are located within a Content Area. From the photo above, within Content Area System Homepage 3 from my home page, I have two Content Blocks in it, the rotating banner and my product grid.

Content blocks can be used in an area and in any combination you want on your website as long as there's room for it. What this means is, you cannot put your rotating banner that is on your home page, into the sidebar, obviously the area would not accommodate the big images. You could still use an Image Rotator in your sidebar, but you would have to use images that would fit in that area. Note: The dimensions of a Content Area cannot be adjusted in the admin; that would require additional development.

You should also note that each of these Content Blocks have their own editing page, meaning they are setup and adjusted differently. For a full list of the Content Blocks and what they do, Click here

Adding a new Content Area

Creating a content area is pretty simple. You will navigate into your admin and go to: Content and Files > Content Areas. You will first give your Content Area a name then click on the add new content area button indicated by the arrow below.

Adding a new Content Blocks to a Content Area

Adding a new Content Blocks to a Content Area

The first step is to decide where you want to add a new content block.

  1. In the above example, Header Search is our Content Area of choice.
  2. Next you will click on the drop down menu on the top of the page indicated by the arrow and select the type of content block you would like to add. For more on that Click here.
  3. Once you've made your selection, simply click on the Add New Content Block button.

Moving and Removing Content Blocks

Moving and Removing Content Blocks
  1. To move/reposition the content blocks within the content area, all you need to do is click on the arrows on the top right of each content block.
  2. To delete a content block, you just need to is click on the trash can icon also located on the top right of each content block.