Page 1 of 1

[solved] help with a 3 column layout

Posted: Thu Aug 09, 2007 11:08 am
by glennn.php
i'm just learning this wonderful script - can someone provide me a simple 3 column layout with which i can get to know this script while building the site?

I've searched the forums for one, but the few i found didn't work right...

I sincerely appreciate any help -

Glenn

Re: help with a 3 column layout

Posted: Thu Aug 09, 2007 11:27 am
by RonnyK
Find below the code for a 3-column layout based on the "CSSmenu Top + 2 COL". The idea is to have two sidebars called, floating LEFT and RIGHT and then pushing the content in the remaining area. Check the CSS that comes with the default installation to do what you want. I only inserted the area that is touched by inserting a third column. If you need more, I can post the full template.

Code: Select all

   <!-- Start Content (Navigation and Content columns) -->
   <div id="content">

      <!-- Start Sidebar -->
      <div id="leftsidebar">
      </div>
      <!-- End Sidebar -->

     <!-- Start Right Sidebar  -->
     <div id="rightsidebar" align='center'>
     <hr class="accessibility" />
     </div> 
     <!-- End Right Sidebar  -->


      <!-- Start Content Area -->
      <div id="main">
         <h2>{title}</h2>
         {content} <br />
         <!-- Start relational links -->
         <div class="hr"></div>
         <!-- End relational links -->
       <hr class="accessibility" />
      </div>
      <!-- End Content Area -->
Stylesheet:

Code: Select all

div#leftsidebar {
   float: left;
   margin-left: 0px;
   margin-right: 0px;
   width: 160px;   
   padding: 2px;
}

div#rightsidebar {
   float: right;
   margin-left: 3px;
   margin-right: 3px;
   margin-bottom: 5px;
   width: 160px;
   padding: 0px;
}

div#main {
   float: left;
   width: 680px; 
   margin-left: 0px;
   margin-right: 0px;
   padding: 0px;
   background-color: #EFEFEF ;
}

Ronny

Re: help with a 3 column layout

Posted: Thu Aug 09, 2007 12:14 pm
by glennn.php
thanks rodney - yes, could you post the whole template so i can study it? i'm somewhat familiar with float: right, left, but still new at it, as well as new with this script...

i'm assuming i just save the entire code as a new template, and then replace stylesheets.css with this css file...?

thanks
g

Re: help with a 3 column layout

Posted: Thu Aug 09, 2007 12:36 pm
by glennn.php
sorry - i meant Ronny :) ...

i think i can use this after looking at it, thanks...

G

Re: help with a 3 column layout

Posted: Thu Aug 09, 2007 1:22 pm
by RonnyK
Glenn,

the easiest way is copying the original template to a new one, with the copy-button in the templates area. Then replace the original area with the area I inserted earlier. Also go to the Stylesheets, copy the original stylesheet that is for the template to a new name, within the templates go to the CSS_button, unattach the orignal one, attach the new copied one, and change the logic there. Now you have a new template/stylesheet, that can be used, while all default content is still the same.

I didn't sent the total template earlier, as it will work on most templates, it's just the logic you might want to use, so with a small change this will be the same for the "2-col left menu", to be replaced with a third column. So this is only the "active" part for the third column.

Ronny

Re: help with a 3 column layout

Posted: Thu Aug 09, 2007 1:29 pm
by glennn.php
yeah, i'm figuring this out now...

i'm just impatient :)

Re: help with a 3 column layout

Posted: Thu Aug 09, 2007 1:51 pm
by glennn.php
got it - awesome, thanks...

this is a nice script - so many are way too tedious for the average html ignorant client...

thanks again...

GN

Re: help with a 3 column layout

Posted: Thu Aug 09, 2007 1:54 pm
by RonnyK
I was just typing, that if you wanted the "CSSmenu top - 2 col " layout, that I could give the full template/stylesheet, but you probably went for another template.

But you already succeeded,

Ronny

Re: help with a 3 column layout

Posted: Thu Aug 09, 2007 5:06 pm
by Dr.CSS
You can also get some wireframe templates @...

http://themes.cmsmadesimple.org/Theme_Frameworks.html

Re: [solved] help with a 3 column layout

Posted: Wed Jan 28, 2009 1:08 pm
by Used
Ronny,
I am pretty new here and i am looking for a 3 column theme. Can you send me the full theme? I tried to modify the 2 column version to 3 columns like you explained to Glenn.php, but it is not working. It's probably just me, but it would help if you colud send me the theme so i can see what i do wrong.

Thanks.