Template Areas

Drag and Drop Design with Templates and Sections

Introduction

Sections and template-areas are the key to drag-and-drop control in platform. They allow you complete creative freedom in placing and customizing ‘professional’ web design in your site.

While sections and templates are extremely easy to use, some concepts may be new to people, so please spend some time to understand how they interact. Once you do, you’ll be creating awesome websites in a snap.

Template Areas

Understanding drag and drop starts with understanding how templates work inside the framework.

There are two levels of structure to the templates…

Parent Areas – Header, Footer, The Templates, and Morefoot Area
Content Areas – Posts Page Content Area (e.g. blog and category pages), Single Post Content Area (viewing a post), and Page Content Area (content on page templates)

Parent Template Areas

Parent template areas are shown on all pages, although the “templates” area shows different content based on the page template selected.

The structure for the parent areas looks like this:

Content Area

WordPress Content, Sidebars, etc…

A special section is used with parent “templates” to handle the WordPress content.

This section is called “content area,” and this section contains:

Sidebar 1 Area
Sidebar 2 Area
Sidebar Wrap
Text Content Area – In this area you can set up different sections based on the page type.

Again the “text-content” area is special as different sections are shown based on your settings in the admin panel. Currently, you can have different section lists based on if the page is a posts page, a single post page or a regular page type.

The structure for the content section works like this: