Title: Special Page Layout
Last modified: August 19, 2016

---

# Special Page Layout

 *  [zigggy](https://wordpress.org/support/users/zigggy/)
 * (@zigggy)
 * [16 years, 4 months ago](https://wordpress.org/support/topic/special-page-layout/)
 * Hi everyone,
    I’m trying to redesign my site’s homepage but have had no luck 
   thus far. On the homepage using my current theme, I would like a three column
   layout. In the leftmost column, I would like to display my latest posts under
   a custom header. The middle and right columns should be static text (that I can
   change, much like a footer or sidebar widget). Again, this design should only
   apply to the homepage.
 * How do I go about doing this? I hate asking for help like this (I know it’s annoying),
   but I’ve tried and failed several times.
 * The website is [here](http://minervandialogues.com).
 * Thanks very, very much in advance.
    -zigggy

Viewing 13 replies - 1 through 13 (of 13 total)

 *  [jrav001](https://wordpress.org/support/users/jrav001/)
 * (@jrav001)
 * [16 years, 4 months ago](https://wordpress.org/support/topic/special-page-layout/#post-1455435)
 * First, read this: [http://codex.wordpress.org/Creating_a_Static_Front_Page](http://codex.wordpress.org/Creating_a_Static_Front_Page)
   
   You will need to create another page to use as your “static” front page. This
   page will also explain how to display the latest post.
 * Then, after
 * `<div class="content">`
 * add: `
    <div class=”col”> This is the left </div> <!– col –>
 * <div class=”col”>
    This is in the middle </div> <!– col –>
 * <div class=”col”>
    This is on the right </div> <!– col –>
 *     ```
       In your css file, add
       ```
   
 * .col { float:left; margin:0 30px 15px 0; width:270px; }
    `
 * You will have to fiddle with the width to make it fit properly.
 *  Thread Starter [zigggy](https://wordpress.org/support/users/zigggy/)
 * (@zigggy)
 * [16 years, 4 months ago](https://wordpress.org/support/topic/special-page-layout/#post-1455449)
 * Where do I find `<div class="content">`
    and where in the CSS file does `.col{
   float:left; margin:0 30px 15px 0; width:270px; }` go?
 *  [divazucom](https://wordpress.org/support/users/divazucom/)
 * (@divazucom)
 * [16 years, 4 months ago](https://wordpress.org/support/topic/special-page-layout/#post-1455450)
 * we need to see your theme codes. everytheme uses different class names.
 *  Thread Starter [zigggy](https://wordpress.org/support/users/zigggy/)
 * (@zigggy)
 * [16 years, 4 months ago](https://wordpress.org/support/topic/special-page-layout/#post-1455452)
 * What page of the theme do you need to see? style.css? index.php? Should I just
   paste the code here?
 *  [jrav001](https://wordpress.org/support/users/jrav001/)
 * (@jrav001)
 * [16 years, 4 months ago](https://wordpress.org/support/topic/special-page-layout/#post-1455468)
 * `<div class="content">` will be found in the page you have set as you homepage.
   The filename will end in .php
 * The `.col` can go anywhere in your style.css file.
 *  Thread Starter [zigggy](https://wordpress.org/support/users/zigggy/)
 * (@zigggy)
 * [16 years, 4 months ago](https://wordpress.org/support/topic/special-page-layout/#post-1455501)
 * Great. How do I enable recent posts to show up in the left column only? I don’t
   see that on the link you sent.
 *  Thread Starter [zigggy](https://wordpress.org/support/users/zigggy/)
 * (@zigggy)
 * [16 years, 4 months ago](https://wordpress.org/support/topic/special-page-layout/#post-1455576)
 * Anyone?
 *  [jrav001](https://wordpress.org/support/users/jrav001/)
 * (@jrav001)
 * [16 years, 4 months ago](https://wordpress.org/support/topic/special-page-layout/#post-1455579)
 * Give this a try….
 *     ```
       <ul>
       <?php $recent = new WP_Query("showposts=2"); while($recent->have_posts()) : $recent->the_post();?>
       <li>
       <a href="<?php the_permalink() ?>" rel="bookmark">
       <h2><?php the_title(); ?></h2>
       </a>
       <?php the_content(__('Read more...'));?>
       </li>
       <?php endwhile; ?>
       </ul>
       ```
   
 * The number of posts displayed is controlled by `showposts=2`
 *  Thread Starter [zigggy](https://wordpress.org/support/users/zigggy/)
 * (@zigggy)
 * [16 years, 4 months ago](https://wordpress.org/support/topic/special-page-layout/#post-1455581)
 * Sorry, where do I put that code?
 *  [jrav001](https://wordpress.org/support/users/jrav001/)
 * (@jrav001)
 * [16 years, 4 months ago](https://wordpress.org/support/topic/special-page-layout/#post-1455582)
 * If you are using the code I posted above…
 *     ```
       <div class="col">
       This is the left
       </div> <!-- col -->
       ```
   
 * Replace “This is the left” with the the snippit to display the post.
 *  Thread Starter [zigggy](https://wordpress.org/support/users/zigggy/)
 * (@zigggy)
 * [16 years, 4 months ago](https://wordpress.org/support/topic/special-page-layout/#post-1455584)
 * I put in the code, but the column layout still doesn’t appear. I edited the index.
   php file through the theme editor feature on the dashboard. My homepage is a 
   static page I created…what am I doing wrong?
 *  Thread Starter [zigggy](https://wordpress.org/support/users/zigggy/)
 * (@zigggy)
 * [16 years, 4 months ago](https://wordpress.org/support/topic/special-page-layout/#post-1455589)
 * Anyone?
 *  [jrav001](https://wordpress.org/support/users/jrav001/)
 * (@jrav001)
 * [16 years, 4 months ago](https://wordpress.org/support/topic/special-page-layout/#post-1455615)
 * Are you using index.php as your home page or have you set it to another page?
   When I view your homepage, I cannot see the code for the columns.

Viewing 13 replies - 1 through 13 (of 13 total)

The topic ‘Special Page Layout’ is closed to new replies.

 * 13 replies
 * 3 participants
 * Last reply from: [jrav001](https://wordpress.org/support/users/jrav001/)
 * Last activity: [16 years, 4 months ago](https://wordpress.org/support/topic/special-page-layout/#post-1455615)
 * Status: not resolved

## Topics

### Topics with no replies

### Non-support topics

### Resolved topics

### Unresolved topics

### All topics
