Wordpress Themes - WP Forum at BFA

Wordpress Themes - WP Forum at BFA (http://forum.bytesforall.com/index.php)

- Montezuma Theme (http://forum.bytesforall.com/forumdisplay.php?f=53)

- - Creating Home Page (http://forum.bytesforall.com/showthread.php?t=20456)

Creating Home Page

Hello:

Thank you for your work on this template. I am having some problems setting up the home page.

This is the layout I want:

1. Column 1: Sidebar Widget area on left side of the page (100 pixels)
2. Column 2 (200 pixels)
3. Column 3 (335 pixels)
4. Column 4 (200 pixels)
5. Column 4 Sidebar Widget area on right side of the page (120 pixels)

I have managed to get the posts to show in rows and columns, but cannot figure out how to get the widget areas to show on the index page.

I would appreciate some help to get this done. :)

Thank you,
Sumeros

So you want a five-column layout with fixed widths for your columns? Do you not need a margin in between columns?

If you read the documentation in your Dashboard > Appearance > CSS Settings > Choose CSS Grid, it says that you can create custom widths, but everything, including margins, have to add up to 960 pixels. Right now you have 955 px, so you're 5 px short, unless you intend to add some spacing in-between your columns with a margin.

So one example would be to add this to your index.php (note 5px margin to left of column 3 to make total width 960 px):

Code:

<?php get_header('Foo'); ?>

<div class="row">

   <div id="widgetarea-left" style="width:100px">

      <?php dynamic_sidebar( 'Widget Area LEFT' ); ?>

   </div>

   <div style="width:200px">

      ... Column 2 ...

   <div>

   <div style="width:335px;margin-left:5px;">

      ... Column 3 ... 

   <div>

   <div style="width:200px">

      ... Column 4 ...

   <div>

   <div id="widgetarea-right" style="width:120px">

      <?php dynamic_sidebar( 'Widget Area RIGHT' ); ?>

   </div>

</row>

<?php get_footer(); ?>

This should give you widget areas to the left and right, called Widget Area LEFT and Wdiget Area RIGHT when you go to Appearances > Widgets.

Try a test page and make each div a different background color. Remember, backgrounds cover padding, but not margins. If you're not using margins on the sides of your columns, you'll need padding, otherwise the content in your columns will butt up against each other.

Greetings:

I thank both of you for your help with the coding and I will make the adjustments for the space between the columns.