how to add a new column to a template

[inspektor gadget]

hi all together,

i have a little question concerning the Andreas08 s9y v2.0 template.
Is it possible to add another column to that template? i would like to have a three column template with that kind of navigation in the top like that template have it.

or is there a template that have these features?

thx for your help!

[garvinhicking]

Hi!

You can do that by editing the index.tpl file and editing the CSS so that a new column can find its place there.

The you just need to move the call of

Code: Select all

{serendipity_printSidebar side="right"}
{serendipity_printSidebar side="left"}

to seperate them. Leftsidebar call goes to the html/css position where you want the left side, and right side to a right side container.

So it's just a matter of the HTML and CSS construct.

HTH,
Garvin

[inspektor gadget]

hi garvinhicking,

super danke für deine hilfe !

thx for your help !

greetz,

[inspektor gadget]

hi garvinhicking,

i thougt it would be easy like this:

Code: Select all

<div id="sidebar_left">
            {serendipity_printSidebar side="left"}
</div>
<div id="sidebar_right">
			{serendipity_printSidebar side="right"}
</div>

but that wont work.
how do i have to seperate them?

thx in advanced!

[garvinhicking]

Hi!

What did you write up for #sidebar_left and #sidebar_right in your style.css? Of course you must create a properly floating/positioned CSS container for the target elements.

Best regards,
Garvin

[yellowled]

Code: Select all

<div id="sidebar_left">
            {serendipity_printSidebar side="left"}
</div>
<div id="sidebar_right">
			{serendipity_printSidebar side="right"}
</div>

but that wont work.
how do i have to seperate them?

Well, this would be the desirable order in the code since this would be a so-called "content first" order (the actual content would be generated before the sidebars). However, that's pretty hard to pull off, i.e. it's pretty difficult to arrange the columns using CSS that way.

andreas08 is a fixed width template, meaning you have a container div (#mainpane, 760px wide) which holds content (#content, 525px + 20px padding-left = 545px) and sidebar (#sidebar, 175px + 10px padding-right = 185px). You'll have to arrange #content, #sidebar_left and #sidebar_right using CSS to fit into that container. The first problem is that the andreas08 style.css doesn't style #sidebar_left and #sidebar_right at all, simply because they didn't exist before (only #sidebar existed), so you'll have to add those two to style.css. Then you'll have to work out sensible widths for each of the three (including padding) and how to float them - you'll probably end up floating #sidebar_left and #content left and #sidebar_right right, but that's hard to predict without a test environment.

YL

[inspektor gadget]

hi yellowled and garvinhicking,

thx for your help. Now I have the information i need. If it is fixed, i will post the result.

thx,

[inspektor gadget]

hi,
i can seperate them, but how can i push the right sidebar to the right side?
sounds damn stupid, but my knowledge in css is very little.

thx for your help!

[yellowled]

i can seperate them, but how can i push the right sidebar to the right side? sounds damn stupid, but my knowledge in css is very little.

Depends. It would be much easier if you showed us your code (.tpl and .css), or, even easier, gave us an URL to the blog in question.

YL

[inspektor gadget]

hi yellowled,

easy, here is the URL:
http://webspion.info/

as you can see i have a solid black border around the "second" sidebar.

but the "second" sidebar is always at the bottum of the first one......

[d_cee]

Hi

I just took a look but you seem to have changed the template to Carl's default which is working fine

Dave

[inspektor gadget]

hi d_cee,

sorry! one of my mates changed the style without asking me.
Now you can find the Andreas08 s9y v2.0 theme.

Sorry !

[d_cee]

Hi

there are a few things you'll need to do to get the right sidebar on the right.

You should make your #mainpane the same size as you've made the header.

You'll need to float the .contentleft #sidebar_right to the right and float
.contentleft #content to the left and set the size to 500px

Then if you adjust the padding on the .contentleft #sidebar_left and .contentleft #sidebar_right it should all fall into place for you

HTH

Dave

[inspektor gadget]

@d_cee: what can i say? absolutly perfekt ! thx for your help !!!