Hi, George,
In your theme create a folder, "templates", and inside create the file, "side-ads.php":
<div class="side-ads left-side">
<div class="ad-block-wrap"><div class="ad-block block-1">AD 1 code</div></div>
<div class="ad-block-wrap"><div class="ad-block block-2">AD 2 code</div></div>
<div class="ad-block-wrap"><div class="ad-block block-3">AD 3 code</div></div>
<div class="ad-block-wrap"><div class="ad-block block-4">AD 4 code</div></div>
<div class="cleared reset-box"></div>
</div>
<div class="side-ads right-side">
<div class="ad-block-wrap"><div class="ad-block block-1">AD 5 code</div></div>
<div class="ad-block-wrap"><div class="ad-block block-2">AD 6 code</div></div>
<div class="ad-block-wrap"><div class="ad-block block-3">AD 7 code</div></div>
<div class="ad-block-wrap"><div class="ad-block block-4">AD 8 code</div></div>
<div class="cleared reset-box"></div>
</div>
In "style.css" add the following rules:
/*--> side ads */
.side-ads {
position: absolute;
display: block;
width: 150px;
height: auto;
top: 20px;
}
.left-side {
left: -170px;
}
.right-side {
right: -170px;
}
.ad-block-wrap {
position: relative;
display: block;
width: 100%;
margin-bottom: 20px;
}
.ad-block {
display: table-cell;
width: 150px;
color: #fff;
text-align: center;
vertical-align: middle;
border: 1px solid #ae3433;
background-color: #7b3535;
}
.block-1 {
height: 200px;
}
.block-2 {
height: 100px;
}
.block-3 {
height: 120px;
}
.block-4 {
height: 100px;
}
In "header.php" find:
<div class="art-sheet-body">
and add the template call right after:
<div class="art-sheet-body">
<?php get_template_part('templates/side','ads'); ?>
Just adjust the sizes in the css, and the code gets inserted within the divs of side-ads.php.
*In IE7 and older the text doesn't vertical-align.