left col

Page Layout Style

Version 5 templates allow you to customize the page layout for each page. We have a tool that will craft the layout code so that your pages are built to your specifications without you needing to understand any code. Just design the stucture and copy/paste into your body class.

Our pages are all created with 5 boxes containing 10 editable sections each. The way the boxes are organzied within each box is entirely up to you, and each of the boxes will stack one on top of the other. This means you have up to 50 editable sections.

To learn more about the actual layout tool check out the building a layout section in our Omni CMS section.

right col

left col

Body Class

At the top of each content page you'll find a editable section for the body class. This section is where you'll paste the layout code that you create in the layout tool.

Part of the layout tool is an option for creating a gap. By default there is no gap between sections. If you choose to use one at the body level it will apply to all sections on your page.

body class css field

Layout Gaps

Grid layout acts like a brick wall of sections that create the page. The gap class acts like a mortor joint between the bricks. There are preset gap sizes that go from 2px wide to 20px wide depending on the needs of the page.

These can be added at the body class level for the whole page, or put at the box level to give greater control over just the sections within.

gap-2
gap-5
gap-8
gap-10
gap-15
gap-20

For a better example check out the spacing styles and see what the gap will look like.

right col

left col

right col