Creating a Multiple Column Page Template

Page templates define the appearance of individual pages, including the placement of page controls and components. Each page template is divided into three sections: Header, Body, and Footer. The most basic template must include the substitution string #BOX_BODY# in the Body attribute. When the page is rendered, the Application Express engine replaces #BOX_BODY# with HTML to display the regions on that page.

You can create a multiple column page by defining a page template that contains a multiple column table. You then explicitly place regions within specific table cells.

The following example demonstrates how to create a two-column page and specify a region position using the #REGION_POSITION_XX# substitution string in each column. You would enter the code in the Body section of the page-level template as shown in the following example.:

<body #ONLOAD#>
  #FORM_OPEN#
  <table style="width:100%">
    <tr>
      <td style="width:50%;padding:5px;">#REGION_POSITION_01#</td>
      <td style="width:50%; border-left:2px #bbbbbb dashed; padding:5px;">#REGION_POSITION_02#</td>
    </tr>
  <br />
  #BOX_BODY#
  #FORM_CLOSE#
</body>

The following is an alternative DIV-based example:

<body #ONLOAD#>
  #FORM_OPEN#
  <div style="width:100%">
    <div style="float:left;width:50%;">#REGION_POSITION_01#</div>
    <div style="float:left;width:50%;">#REGION_POSITION_02#</div>
  </div>
  #BOX_BODY#
  #FORM_CLOSE#
</body>

Once you create this page-level template, the newly defined positions would be available as Display Point options when you run the Create Region Wizard.