display blog posts on static page - wordpress-theming

Question

I am rather new to Wordpress and have a question. I have created my own theme, which all seems to work fine. But, I am having one issue. I want to create my blog page (with all the posts) on a page other than my home page. So, in my theme folder, I created a page template called blog.php:
<?php
/*
Template Name: blog
*/
?>
<?php get_header(); ?>
<table id="about-table" >
<tr>
<td colspan="7">
<?php if (have_posts()) : while (have_posts()) : the_post();?>
<?php the_title(); ?>
<?php the_author(); ?>
<?php the_time("jS F"); ?>
<?php comments_number("0","1","%"); ?>
<?php the_excerpt(); ?>
<?php endwhile; endif; ?>
</td>
</tr>
</table>
<?php get_footer(); ?>
Then, I created a page in wordpress called "blog" as well, in the "pages" section in the dashboard. I then assigned its template to the above "blog" template. The problem is, though, that the code does not work as it should. Instead of showing me the titles, comments, etc of the posts, it displays some other info. On the other hand, if i just copy this:
<table id="about-table" >
<tr>
<td colspan="7">
<?php if (have_posts()) : while (have_posts()) : the_post();?>
<?php the_title(); ?>
<?php the_author(); ?>
<?php the_time("jS F"); ?>
<?php comments_number("0","1","%"); ?>
<?php the_excerpt(); ?>
<?php endwhile; endif; ?>
</td>
</tr>
</table>
to my index page, it works fine. So, how do I display all my post info on a page other than the home page?

Answer 1

I wanted to provide you with a simpler loop as a second option. If you use this and set Reading settings to the specific blog page this works well:
<?
/*
Template Name: Blog Template Example
*/
?>
<?php get_header(); ?>
<?php if (have_posts()) : while (have_posts()) : the_post(); ?>
<div <?php post_class(); ?> id="post-<?php the_ID(); ?>">
<h1><?php the_title(); ?></h1>
<?php the_content(); ?>
</div>
<?php endwhile; ?>
<div class="navigation">
<div class="next-posts"><?php next_posts_link(); ?></div>
<div class="prev-posts"><?php previous_posts_link(); ?></div>
</div>
<?php else : ?>
<div <?php post_class(); ?> id="post-<?php the_ID(); ?>">
<h1>Not Found</h1>
</div>
<?php endif; ?>
<?php get_sidebar(); ?>
<?php get_footer(); ?>

Answer 2

How about you do something like this:
blog-template.php:
<?php/*
Template Name: Blog Page
*/
?>
<?php get_header(); ?>
<?php get_template_part( 'layout-page', 'blog' );?>
<?php get_footer(); ?>
layout-page-blog.php:
<?php
the_post();
$title = get_the_title();
$baselink = get_permalink();
$category = get_field('category_blog');
if( !empty($category) ){
$post_per_page = get_option('posts_per_page');
$paged = (get_query_var('page')) ? get_query_var('page') : 1;
$categoryID = get_category_id($category);
$total = get_post_count(array($categoryID));
$the_query = new WP_Query("posts_per_page={$post_per_page}&cat= {$categoryID}&paged={$paged}");
?>
<div id="wrapper">
<div id="content">
<h1 class="title"><?php echo $title; ?></h1>
<div class="content-middle">
<div class="node">
<?php while ( $the_query->have_posts() ) : $the_query->the_post(); ?>
<h3><?php the_title(); ?></h3>
<div class="content">
<?php echo content(150); ?>
</div>
<div class="read-more">Read more</div>
<?php endwhile; ?>
<br/><br/>
<div class="wp-paginate">
<?php
wp_reset_query();
echo paginate_links( array(
'base' => $baselink.'%_%',
'total' => ceil($total/$post_per_page),
'current' => $paged,
));
?>
</div>
</div>
</div>
</div> <!-- end content -->
<div style="clear:both"></div>
</div>
<?php
}
?>
This could all be in one file, or you can use it in two pieces as I have written it.
EDIT:
Sorry I have it set to also grab the images from the post. I think this is the functions code you need:
function get_images_by_cat($id){
$limit = 1000;
$the_query = new WP_Query("posts_per_page={$limit}&cat={$id}");
$arr = array();
while ( $the_query->have_posts() ) {
$the_query->the_post();
$title = get_the_title();
$image_src = get_field('banner_image');
$image_link = get_field('banner_link');
$arr[] = array(
"title" => $title,
"link" => $image_link,
"image" => $image_src,
);
}
wp_reset_query();
return $arr;
}