6. Page Templates

To make it easy to add variety to your site, Bloggy offers different page templates.

6.1 Full Width Page

Navigate to the pages and open a new page "Full Width Page". This page uses "Full-width widthout header image" template from the "Page Attributes"!

You can add content inside the page editor.

 

 

6.2 Custom Page

Navigate to the pages and open a new page "Custom Page". This page uses "Full-width with header image" template from the "Page Attributes"!

You can add content inside the page editor.

 

 

6.3 Page with Sidebar

Navigate to the pages and open a new page "Page with Sidebar". This page uses "Page with Sidebar" template from the "Page Attributes"!

You can add content inside the page editor.

 

 

6.4 Page with Columns

Navigate to the pages and open a new page "Page with Columns". This page uses "Full-width widthout header image" template from the "Page Attributes"!

You can add content inside the page editor.

Theme has ability to display different column layouts. Here is some useful HTML you can use to split the page layout into five, four, three, or two columns:

Five-Column Layout

<div class="clearfix">     <div class="one_fifth">This text inside the div code is what will appear in your first column!</div>     <div class="one_fifth">This text inside the div code is what will appear in your first column!</div>     <div class="one_fifth">This text inside the div code is what will appear in your first column!</div>     <div class="one_fifth">This text inside the div code is what will appear in your first column!</div>     <div class="one_fifth lastcolumn">This text inside the div code is what will appear in your first column!</div> </div>

 

Four-Column Layout:

<div class="clearfix">     <div class="one_fourth">This text inside the div code is what will appear in your first column!</div>     <div class="one_fourth">This text inside the div code is what will appear in your first column!</div>     <div class="one_fourth">This text inside the div code is what will appear in your first column!</div>     <div class="one_fourth lastcolumn">This text inside the div code is what will appear in your first column!</div> </div>

 

Three-Column Layout

<div class="clearfix">     <div class="one_third_main">This text inside the div code is what will appear in your first column!</div>     <div class="one_third_main">This text inside the div code is what will appear in your first column!</div>     <div class="one_third_main lastcolumn">This text inside the div code is what will appear in your first column!</div> </div>

 

Two-Column Layout

<div class="clearfix">     <div class="one_half">This text inside the div code is what will appear in your first column!</div>     <div class="one_half lastcolumn">This text inside the div code is what will appear in your first column!</div> </div>

 

One_Third and Two_Third Column Layout

<div class="clearfix">     <div class="one_third">This text inside the div code is what will appear in your first column!</div>     <div class="two_third lastcolumn">This text inside the div code is what will appear in your first column!</div> </div>

 

Two_Third and One_Third Column Layout

<div class="clearfix">     <div class="two_third">This text inside the div code is what will appear in your first column!</div>     <div class="one_third lastcolumn">This text inside the div code is what will appear in your first column!</div> </div>