Page 1 of 1

how to add a new column to a template

Posted: Tue Apr 17, 2007 10:37 am
by 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!

Re: how to add a new column to a template

Posted: Tue Apr 17, 2007 10:41 am
by 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

Posted: Tue Apr 17, 2007 10:44 am
by inspektor gadget
hi garvinhicking,

super danke für deine hilfe !

thx for your help !

greetz,

Posted: Tue Apr 17, 2007 10:56 am
by 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!

Posted: Tue Apr 17, 2007 11:03 am
by 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

Posted: Tue Apr 17, 2007 11:12 am
by yellowled
inspektor gadget wrote:

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

Posted: Tue Apr 17, 2007 1:25 pm
by 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,

Posted: Wed Apr 18, 2007 12:15 pm
by 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!

Posted: Wed Apr 18, 2007 1:31 pm
by yellowled
inspektor gadget wrote: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

Posted: Wed Apr 18, 2007 2:40 pm
by 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......

Posted: Wed Apr 18, 2007 6:16 pm
by 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

Posted: Thu Apr 19, 2007 9:21 am
by 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 !

Posted: Thu Apr 19, 2007 11:36 am
by 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

Posted: Thu Apr 19, 2007 11:51 am
by inspektor gadget
@d_cee: what can i say? absolutly perfekt ! thx for your help !!!