Wordpress : Multiple Columns on Homepage

I am trying to create a Wordpress site. The design is Here

I have created most of the outline of the site, barring the 3 regions "Follow Us", "Self Employment" & "Into Work Consortium".

The client has told me he would like to make those 3 regions editable.

My template contai开发者_如何学Pythonns an Index file, Header & Footer File as well as the obvious CSS files.

I am using the "Multi Edit Plugin" Multi Edit Plugin but that guide, does it so that you create a CustomPage. I guess I could do that but what I want is my index.php file to be added to the admin side of the site and then point the template there or similar.

As it's getting a little frustrating working with multiple WP plugins that just don't seem to do the job correctly.

There are many ways to go about this: one being what was mentioned by Pekka and the other using Custom Page templates.

The above mentioned methods are, in theory, quite similar with subtle differences in terms of execution and inclusion.

Perhaps to better answer your question, I will provide a very brief sample outline below on Custom Post Templates. You may probably need to do a little more digging at Wordpress' Codex if you choose to further enhance anything else:

Custom Post Template Method

Referring to the wireframe provided in your image link, I propose that you use category filters to filter the associated posts to the right columns. So first up, you will need to create 4 categories for the method that I'm suggesting, namely: WELCOME, FOLLOW, SELF-EMPLOYMENT and CONSORTIUM.

After doing so, your index.php should look something like this:

INDEX.PHP

<?php get_header();?>

<!--container-->
<div id="container">

<?php query_posts('category_name=welcome&showposts=1'); ?>

<?php while (have_posts()) : the_post(); ?>

   <!--top-content-->
   <div class="top-content">

       <h2><a href="<?php the_permalink();?>"><?php the_title();?></a></h2>

       <p><?php the_content();?></p>

   </div>
   <!--top-content-->

<?php endwhile;?>

   <!--bottom-content-->
   <div class="bottom-content">

       <!--follow-->
       <div class="follow">

           <?php include(TEMPLATEPATH . '/follow.php');?>

       </div>
       <!--follow-->

       <!--self-employment-->
       <div class="self-employment">

           <?php include(TEMPLATEPATH . '/self-employment.php');?>

       </div>
       <!--self-employment-->

       <!--consortium-->
       <div class="consortium">

           <?php include(TEMPLATEPATH . '/consortium.php');?>

       </div>
       <!--consortium-->

   </div>
   <!--bottom-content-->

</div>
<!--container-->

<?php get_footer();?>

What is happening here is that I'm doing a post query for posts tagged to the category "WELCOME" and filter the posts into the top-content DIV. Note that my loop starts right before of the top-content DIV and ends immediately after it. This will means that the loop will only affect that particular DIV. I have also set the post limit to "1", thereby restricting the display of posts to just the latest post.

Following on from there, you will notice that in the bottom-content DIV, I have included 3 different files for each column. These 3 files will be your custom post templates that you will need to create and have a post query to filter in the right post. An example of the custom post template will look something like this below:

FOLLOW.PHP

<?php query_posts('category_name=follow&showposts=1'); ?>

<?php while (have_posts()) : the_post(); ?>

    <h2><a href="<?php the_permalink();?>"><?php the_title();?></a></h2>

    <?php the_post_thumbnail('bottom-content-thumb');?> <!--you will have to enable featured image thumbs in your functions.php file before you can do this-->

    <span class="read-more"><a href="<?php the_permalink();?>">Continue Reading</a></span> <!--there are other ways to do the read more link, but I'm just giving an example now so yeah-->

<?php endwhile;?>

The rest of the custom post templates for the bottom 3 columns should look something like the above. If there is any variation of style and all, you will probably have to shift things around and play around with the CSS.

I want to stress that this is not the one and only way to do what you hope to achieve, but rather, that it is one of the many. What I've suggested is only an example that hopes to provide some insights on how you can utilize Custom Post templates for developing Wordpress based sites.

My advice at the end of the day is to delve deeper into Codex and find out more about Custom Post/Page templates because eventually, they will come in very handy if you choose to make custom Wordpress templates.

Hope my post had made things a little clearer for you =)