How to Get Posts in Multiple Places in Wordpress theme? - wordpress

Question

I'm really newbie to wordpress theme development and I want to get recent 10 posts inside front-page.php and all posts inside the index.php (I have no idea if a better way is there) followed by pagination.
Update : I want to have a home page that shows 10 posts and a articles page that shows all posts.
Is this approach right? if it is, how do I do that?

Answer 1

after some research I found a solution to do that.
at first I created 2 pages called home and articles, then I changed Setting -> Reading :
Front Page -> home
and
Posts Page -> articles.
then I put the following in the index.php as articles page :
<?php
if (have_posts()) : while (have_posts()) : the_post();
get_template_part('content', get_post_format());
endwhile; endif;
?>
then inside of front-page.php :
<?php
// the query
$wpb_all_query = new WP_Query(array('post_type' => 'post', 'post_status' => 'publish', 'posts_per_page' => 10)); ?>
<?php if ($wpb_all_query->have_posts()) : ?>
<!-- the loop -->
<?php while ($wpb_all_query->have_posts()) : $wpb_all_query->the_post(); ?>
<div class="post">
<div class="col-xs-12 col-lg-6">
<div class="panel panel-default ">
<div class="panel-body">
<div class="col-xs-4">
<a href="<?php the_permalink(); ?>">
<?php if (has_post_thumbnail()) : ?>
<img src="<?php the_post_thumbnail_url(); ?>" alt="">
<?php else: ?>
<img
src="<?php bloginfo('template_directory'); ?>/assets/image/placeholder.jpg"
alt="">
<?php endif; ?>
</a>
</div>
<div class="col-xs-8">
<div class="title">
<a href="<?php the_permalink(); ?>">
<h2><?php the_title(); ?></h2>
</a>
</div>
<div class="content">
<p><?php echo substr(get_the_content(), 0, 320); ?>...</p></div>
<div class="read-more">
Read More
</div>
</div>
</div>
</div>
</div>
</div>
<?php endwhile; ?>
<!-- end of the loop -->
<?php wp_reset_postdata(); ?>
<?php else : ?>
<p><?php _e('Sorry, no posts matched your criteria.'); ?></p>
<?php endif; ?>
finally it works in the way exactly what I wanted.