DIY Themes – Part 5: The Sidebar
I figured I would’ve had more to say about the sidebar, but after adding one image and adjusting some typographic styles I was able to come close to what I was looking for.
Click screen shot to view.
Certainly nothing overly fancy going on here but that was my intention. I simply wanted a bit of separation from the content. Besides, this is just ‘roughed’ in for the moment.
By right-aligning a y-repeated graphic in the #container style I was able to shade my sidebar:
#container {
width: 970px;
margin: 0 auto;
padding: 0px;
background:#fff url(http://static.tornelements.com/torn_images/sidebarBg.jpg) repeat-y right; /* Sidebar Background Image */
color:#333;
border: 1px solid #555;
}
Now all I had to do was adjust some typography to set the styles for headings and lists.
My main concern to this point has been the layout. I may fine tune (or overhaul completely) the graphics in use before installing the theme on the main site. But once the layout is sound, graphics are no big deal to work on later.
I’ll likely only be making one or two more posts in this series. I fear that I may be boring the crap out of people with my simplistic approach to coding the theme.
What can I say? It’s really all I’ve had time to focus on to this point.
