I need to create a page which will have static content in the right column and list blog posts in the left column. The static content needs to be editable from Dashboard > Pages > Page. How do I do this?
1 Answer
In your wp-content/themes/your-theme folder you need create your own page template...
CUSTOM PAGE TEMPLATE
In the same folder where you just created your new file, you should see a file named page.php. Open that file by choosing to edit it, and then copy everything you find inside of it.
Then, at the very top of the page, you will need to place some code into your file and give your template a name. In my example below, I’ve given my template the name “Test."
<?php
/*
Template Name: Test
*/
?>
Now you’re ready to begin customizing.
TWO COLUMNS
If you don't have your HTML template yet, it may be something like this:
<div id="wrap-page">
<div class="left">
LIST BLOG POSTS HERE
</div>
<div class="right">
CONTENT EDITABLED FROM ADMIN → PAGES → YOUR PAGE
</div>
</div>
Example CSS:
#wrap-page {
width: 100%;
}
.left {
width: 50%;
float: left;
}
.right {
width: 50%;
float: right;
}
or whatever.
ADD BLOG POSTS LIST
In the left column you need custom query:
<?php query_posts(array('post_type' => 'post','orderby' => 'date'));
if(have_posts()) : while(have_posts()) : the_post();
// do something
endwhile; else:
// no posts found
endif; wp_reset_query();
?>
PAGE CONTENT
Content of your page is called with this code:
<?php
if ( have_posts() ) : while ( have_posts() ) : the_post();
// do something
endwhile; else:
// no posts found
endif;
?>
Now you have everything what you need. In admin area choose your new custom template for your page and it's done. If it'll help, here's some example for whole template:
WHOLE CUSTOM PAGE TEMPLATE EXAMPLE
<?php
/*
Template Name: Test
*/
?>
<?php get_header(); ?>
<div id="wrap-page">
<div class="left">
<?php query_posts(array('post_type' => 'post','orderby' => 'date'));
if(have_posts()) : while(have_posts()) : the_post(); ?>
<?php the_post_thumbnail(); ?>
<h3><?php the_title(); ?></h3>
<?php the_content(); ?>
<?php endwhile; ?>
<?php else : ?>
<p>sorry no results</p>
<?php endif; wp_reset_query(); ?>
</div>
<div class="right">
<?php if ( have_posts() ) : while ( have_posts() ) : the_post(); ?>
<?php the_post_thumbnail(); ?>
<h3><?php the_title(); ?></h3>
<?php the_content(); ?>
<?php endwhile; ?>
<?php else : ?>
<p>sorry no results</p>
<?php endif; ?>
</div>
</div>
<?php get_footer(); ?>
Good luck.