Chocolate Fudge

[poopingbag]

I currently have a single sidebar using the Chocolate Fudge template. Is it possible to have two sidebars (one on each side).

Currently all of my items are on the right side according to the administrative backend. For some reason, they appear on the left within my actual website.

If I add something to the left through the administrative backend it simply appends it to the bottom of the existing sidebar.

Hope this makes sense.

www.poopingbag.com

Dale

[judebert]

Wow, it looks great!

Getting another sidebar can be done, but it's not going to be trivial. The problem is that the template's index.tpl puts both sidebars in the same place, and they have a single ID: 'sidebar'.

Open the chocolate_fudge/index.tpl and find the <div id="sidebar">. Remove the bit that says {serendipity_printSidebar side="right"}.

Just above the <div id="footer">, add the new sidebar:

Code: Select all

<div id="rightcolumn">
    <div id="rsidebar">
        {serendipity_printSidebar side="right"}
    </div>
    <div id="rclearingdiv"> </div>
</div>

Next, open the chocolate_fudge/style.css. We'll copy the leftcolumn styles, and change them around for the right side of the page:

Code: Select all

#rightcolumn {position:relative; margin:0 0 10px 0; padding:0;
    width:243px; height:100%; float: right;
    background:#4d2a26 url({TEMPLATE_PATH}img/sidebar_bg.gif) top left repeat-y; }
#rsidebar {padding:0; margin:0 10px 0 0px; font-size:9pt; }
#rclearingdiv {margin:0; padding:0; clear:both; height:21px;
    background:transparent url({TEMPLATE_PATH}img/sidebar_bottom.gif) bottom left no-repeat; }
#rsidebar input, #rsidebar textarea, #rsidebar select {width:95%;border:1px solid #1f1f1f;}
#rsidebar td input {width:150px;}

Upload those to your server, and you should have two sidebars.

You'll also discover you have a width problem. Either the right sidebar will be sticking out like a sore thumb, or the content will be reduced to an itty-bitty skinny column. Either way, it's time to fool around with the style.css some more.

A live CSS editor, like the Firebug extension to Firefox, will make this job a lot less painful. Just keep changing the widths of things until it looks the way you like it, then save everything.

Good luck; let us know how it turns out!

[poopingbag]

That looks like it will definitely take some effort. I'll have a look this weekend and see if I am able to make it work.

Thanks for your help!

[Don Chambers]

As Judebert points out, there will be some effort here, and you may find that effort to be a bit more than you had hoped for.

Your graphics did not anticipate a width greater than what you are currently using. Specifically, the header image graphically forms the top of the existing left sidebar, and has a total width exactly equal to the current page layout.