Zone / Region Conguration - Where the magic happens!

Last updated September 25, 2012. Created by Cellar Door

[1]
on October 4, 2011.Edited by Mark_L6n
[2]
, Kendall
Totten
[3]
, james311
[4]
, brylie
[5]
. Log in to edit this page
[6]
.
First things rst:
It is very important to understand that you should place your content in Blocks, Blocks in Regions,
Regions in Zones & Zones in Sections. The theme settings User Interface (UI) makes positioning blocks,
regions, zones & sections very simple. Unless your theme requires specialized coding, you should expect
that most of your page structure/layout can be done using the UI. Because so much can be done using
the UI there is typically very little need to modify your subtheme using custom code in .tpl les.
Default Theme Settings
The existing sections, zones and regions are sufcient for most use cases. In general, one will do more disabling
of regions and zones than adding of new ones. New regions, zones & sections can be added in the .info le. You
will need to ush cache and move them from the "unassigned" area in your theme settings. It is more common
to create new regions than zones or sections.
Page Structure
A page contains the following elements:
SECTIONS (Zone groups)
ZONES (Containers for Regions)
REGIONS (Grid elements, where Blocks display)
Blocks (Containers for content)
Omega & 960 grid terminology
Containers and Grids in the 960 grid system are what ZONES and REGIONS are in Omega. The container is the
outer wrapper element (div/section/aside/etc) that contains other elements (div/section/aside/etc) with the grid
properties.
Zone & Region Conguration Settings Breakdown
ZONE conguration
For each zone, the following settings are available.
Provide full width wrapper around this zone
https://drupal.org/node/1298694 1 of 3
Enabling this feature will give a wrapper around the zone itself, allowing you to theme in elements that
appear outside the 960 pixel container zone.
Force this zone to be rendered
Enabling this will always render this zone, even if it is empty.
Customize the region positioning
This allows you to manipulate the placing of the regions in this zone.
Section
Denes which section a zone will be in. To move a zone to a different section, choose the desired section
name.
Weight
Denes where the zone will be placed within the section. To move a zone, choose a new weight. Zones are
ordered from lowest number to highest.
Column count
Choose the desired number of columns for the zone. Default options are 12, 16, and 24. Each zone denes its
own column count, which means you can use a different number of columns for each zone on the page.
Primary region
Denes which region within the zone should appear rst in the source code and expand to ll empty space if
other regions in that zone are empty.
Additional zone classes
Enter any CSS classes to be added to the zone for theming.
Additional wrapper classes
Enter any CSS classes to be added to the zone wrapper for theming. This will only be used if the option to
provide a full width wrapper around the zone is enabled.
REGION conguration
For each region, the following settings are available.
Force this region to be rendered
https://drupal.org/node/1298694 2 of 3
https://drupal.org/user/658076 1.
https://drupal.org/user/1009562 2.
https://drupal.org/user/455130 3.
https://drupal.org/user/1972698 4.
https://drupal.org/user/217065 5.
https://drupal.org/user?destination=node/1298694 6.
Enabling this will always render this region, even if it is empty.
Denes which zone a region will be in. To move a region to a different zone, choose the desired zone name.
Prex
Choose the number of empty columns that should appear before this region.
Width
Choose the number of columns this region should take up within the zone. The total number of columns for
regions in a zone (plus any prex or sufx columns) should equal the column count chosen for the zone.
Sufx
Choose the number of empty columns that should appear after this region.
Weight
Denes where the region will be placed within the zone. To move a region, choose a new weight. Regions are
ordered from lowest number to highest. Weight comes into play when you view your site in a mobile device
(or your browser window is set to a smaller width) and the regions begin stacking vertically. When the
regions begin to stack vertically, the region with the least weight will oat to the top, while the region with
the most weight will sink to the bottom. I.E.: If the "Sidebar First Region" has a weight of -5, and the
"Content Region" has a weight of 10, when the window is collapsed to the mobile size the "Sidebar First
Region" will be at the top of that zone, and the "Content Region" will be at the bottom.
Position
This allows you to manipulate the placing of the regions in this zone. To adjust the region position, go to the
Conguration settings for the Zone, and check the box next to "Customize the region positioning".
Positioning means that if your current site displays the "Sidebar First Region" on the left and the "Content
Region" on the right but you'd like to swap the two, you'll need to give the "Content Region" a lower position
number. I.E., "Content Region" should have a position setting of -10, and the "Sidebar First Region" should
have a position setting of 5.
Additional region classes
Enter any CSS classes to be added to the region for theming.
https://drupal.org/node/1298694 3 of 3