Creating a Multiple Column Layout

A region is an area on a page that uses a specific template to format HTML content. You use regions to group page controls. To create a multiple column layout, you create two regions that display in adjacent cells of the same table.

You can create a multiple column layout by either:

Manually creating the two adjacent regions
Defining a page template that contains a multiple column table

Topics in this section include:

Creating Regions in Multiple Columns
Creating a Multiple Column Page Template

Creating Regions in Multiple Columns

You create regions using the Create Region Wizard. To create a two-column page, you create two regions. Oracle Application Express replaces the #BOX_BODY# substitution string within a two-column table and displays the regions in two separate cells.

To create a two-column page by creating regions:

Navigate to the Page Definition. See "Accessing a Page Definition".
Create the first region:
1. Under Regions, click Create.
  
  The Create Region Wizard appears.
2. Select a region type.
3. From the Column field, select 1.
4. Follow the on-screen instructions.
Create the second region:
1. Under Regions, click Create.
  
  The Create Region Wizard appears.
2. Select a region type.
3. From the Column field, select 2.
4. Follow the on-screen instructions.

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.

<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>

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.