Setting up Sidebars in the Privateer Theme

A detailed overview of configuring the sidebars within the Privateer theme.

Please note:
The ability for the sidebar above content areas to merge into one larger area if they are next to each other was just introduced via a patch which is available in the owners forum. If you would like to have this functionality, please see the 1.4 Patch to Span Sidebar Above and Below Content areas thread. If you don't use such functionality, just ignore the below section on doing such.

With that said, let us begin...

In the Privateer Theme, there are currently two sidebars.

Each sidebar has individual options, though the widgets in them share a common set of options.

When considering how I want sidebars to look, here is how I think of them:

Notice that sidebars are containers which contain an unknown number of widgets which are, themselves, containers that hold a title and content block.

The sidebars are configured via the Privateer > HTML Entities > Sidebars menu.

Each sidebar has the following options:

Sidebar X Side:
This tells the privateer which side to place each sidebar on.
If both are on the same side, sidebar 1 will always be to the left of sidebar 2.

Sidebar X Width:
This tells the privateer how wide, in pixels, each sidebar should be.

Sidebar X Display On:
This tells the privateer which types of pages each sidebar should be displayed on.

Sidebar X: Don't display on pages:
This tells the privateer of particular wordpress pages you have created which should not have the sidebar in question displayed on them.
This setting can be handy when using custom displays and/or when you want more area to place content on for a particularly wide page.

Sidebar X: Don't display on categories:
This tells the privateer of particular wordpress category archive pages which should not have the sidebar in question displayed on them.

Sidebar X Style
This is used to set styles for each sidebar individually. A common difference in styling is to have only one or the other have a border when they are both shown on the same side of the main content area.

Sidebar X: Above Box Content
If you want extra content to be shown above a sidebar, you can place it here.
Note that if you do this for both sidebars you should try to make sure that the content in each one is about the same height and be sure to style the TD container to have the minimum height necessary to show the wanted content.

Sidebar X: Above Box Styling TD
This is for styling the table data element that contains the content to be placed above a sidebar.

Sidebar X: Above Box Styling DIV
This is for styling the div element that contains the actual content to be placed above the sidebar. The div is placed inside of a table data element.

Sidebar X: Below Box Content
Sidebar X: Below Box Styling TD
Sidebar X: Below Box Styling DIV
These three are just like the above content areas, but are used to place content below the sidebar in question.
Due to the use of tables, these might show up just above the footer rather than just below the sidebar. I plan to have this fixed in 1.5.

Additionally ( via the patch mentioned above ), sidebar 1 has the following two options:

Sidebar 1: Span Above Box Content
If set and both sidebars are on the same side, any content placed in Sidebar 1: Above Box Content will fill the entire area above both sidebars.
Note that content in above sidebar 1 will not span if there is content set for above sidebar 2!

Sidebar 1: Span Below Box Content
If set and both sidebars are on the same side, any content placed in Sidebar 1: Below Box Content will fill the entire area below both sidebars.
Note that content in below sidebar 1 will not span if there is content set for below sidebar 2!

With these options, you can:

Place the sidebars on either side of your content
Decide which types of pages each sidebar shows up on
Specify the width of each sidebar
Style each sidebar individually
Hide either sidebar on particular single pages and/or category archives
Add extra content above and/or below each sidebar
Merge the above and below content areas for the two sidebars if they are both on the same side of your site and visible

Below are some examples of sidebars and the settings used to get the looks in question...

Two left sidebars with a border to the right of them:

Both sidebars have their side set to left

Sidebar 1 style is set as follows:
padding: 10px 5px 10px 10px;
background: #ffffff;

Sidebar 2 style is set as follows:
padding: 10px 10px 10px 5px;
background: #ffffff;
border-right: 1px solid #CCCCCC;

Two right sidebars with a border on the left

Both sidebars have their side set to the right

Sidebar 1 style is set as follows:
padding: 10px 5px 10px 10px;
background: #ffffff;
border-left: 1px solid #CCCCCC;

Sidebar 2 style is set as follows:
padding: 10px 10px 10px 5px;
background: #ffffff;

Two right sidebars with a shared content box above them:

Both sidebars have their side set to the right

Sidebar 1: Span Above Box Content is set to Yes

Sidebar 1: Above Box Content is as follows
<img style="border: 3px solid #EFEFEF;" src="/wp-content/themes/privateer/images/ealw_300_250.gif" />

Sidebar 1: Above Box Styling TD is as follows
height: 250px;
text-align: center;
border-left: 1px solid #CCCCCC;

Sidebar 1: Above Box Styling DIV is blank

Sidebar 2: Above Box Content is empty

I know that the above/below content areas are a bit strange in 1.4, but plan to re-work the code for 1.5 so that they are simpler to work with and place ( especially the below box areas ).