Two custom loops on same page in wordpress? - wordpress

Question

I wasn't able to find anything on here, so I am bringing this question to you. The following code does mainly what I want, only the page-cycle doesn't work: When I want to navigate to older posts, the page that is seen displays the same new posts again. How do I do this properly?
So index.php has two loops:
<?php
$args = array( 'numberposts' => 1,
'post_status'=>"publish",
'post_type'=>"post",
'orderby'=>"post_date");
$postslist = get_posts( $args );
foreach ($postslist as $post) : setup_postdata($post);
?>
// regular post html with wp tags
<?php endforeach; ?>
<?php
query_posts('posts_per_page=12&offset=1');
if (have_posts()) : ?>
<h3>Headline</h3>
<?php while (have_posts()) : the_post(); ?>
// regular html with wp tags for these posts (teasers, with the_excerpt)
<?php endwhile; ?>
<div class="navigation">
<span class="nextlink"><?php next_posts_link( 'Older', 0 ); ?></span>
<span class="previouslink"><?php previous_posts_link( 'Newer' ); ?></span>
</div>
<?php else : ?>
<h3><?php _e('Nothing found'); ?></h3>
<?php endif; ?>
Here is the explanation: One visits the blog: The most recent blog post is displayed in full length in one block, the 12 older posts (excluding the first one with offset, so 2–13) are displayed in another block with content teasers and a next-previous-navigation at the bottom to display post teasers 14–25 and so on. (The problem: it's always 2–13)
// Edit: Code in response to the top answer, now the full code of the index.php. Notice, that the HTML has changed, since I have used normalized HTML, since it should usually not matter. This times it's the actual code.
<?php get_header(); ?>
<div class="box blog-block">
<?php
$args = array( 'numberposts' => 1, 'post_status'=>"publish",'post_type'=>"post",'orderby'=>"post_date");
$postslist = get_posts( $args );
foreach ($postslist as $post) : setup_postdata($post); ?>
<span class="head"><?php the_time('j. F Y') ?></span>
<h3><?php the_title(); ?></h3>
<div class="entry">
<?php global $more;
$more = 1;
the_content();
?>
<p class="author"><?php the_author(); ?></p>
<p><a class="more-link" href="<?php the_permalink(); ?>#respond" title="<?php the_title();?>">Kommentieren</a>
</div>
<?php endforeach;
wp_reset_postdata(); /* 1. reset post data */
?>
</div>
<div class="box" id="recentposts">
<?php
$paged = ( get_query_var('page') ) ? get_query_var('page') : 1;
$display_count = 12;
$excluded_count = 1;
$offset = ( ($paged-1) * $display_count ) + $excluded_count;
$args = array(
'post_status'=>"publish",
'post_type'=>"post",
'orderby'=>"post_date",
'posts_per_page' => $display_count,
'offset' => $offset,
'paged' => $paged
);
$the_query = new WP_Query( $args );
if ( $the_query->have_posts() ) : ?>
<h3>Bisherige Artikel</h3>
<div class="recentpostsmasonry">
<?php while ( $the_query->have_posts() ) : $the_query->the_post(); ?>
<div <?php post_class('halb'); ?> id="post-<?php the_ID(); ?>">
<span class="head"><?php the_time('j. F Y') ?></span>
<h3><?php the_title(); ?></h3>
<div class="entry">
<?php the_excerpt(); ?>
<p class="more-link">Weiterlesen ...</p>
<p class="comments"><?php edit_post_link(__('Bearbeiten'), '', ' | '); ?> <?php comments_popup_link(__('Schreib den ersten Kommentar'), __('Ein Kommentar'), __('% Kommentare'), '', __('') ); ?></p>
</div>
</div>
<?php endwhile; ?>
</div>
<div class="navigation">
<span class="nextlink" title="Ältere Einträge"><?php next_posts_link( '«', 0 ); ?></span>
<span class="previouslink" title="Jüngere Einträge"><?php previous_posts_link( '»' ); ?></span>
</div>
<?php else : ?>
<h3><?php _e('Nichts gefunden :('); ?></h3>
<?php endif; ?>
</div>
I am trying out this code now (14.10.17), but it doesn't add functioning page navigation...:
<?php get_header(); ?>
<div class="box blog-block">
<?php
$args = array( 'numberposts' => 1, 'post_status'=>"publish",'post_type'=>"post",'orderby'=>"post_date");
$postslist = get_posts( $args );
foreach ($postslist as $post) : setup_postdata($post); ?>
<span class="head"><?php the_time('j. F Y') ?></span>
<h3><?php the_title(); ?></h3>
<div class="entry">
<?php global $more;
$more = 1;
the_content();
?>
<p class="author"><?php the_author(); ?></p>
<p><a class="more-link" href="<?php the_permalink(); ?>#respond" title="<?php the_title();?>">Kommentieren</a>
</div>
<?php endforeach;
wp_reset_postdata(); /* 1. reset post data */
?>
</div>
<div class="box" id="recentposts">
<?php
$paged = ( get_query_var('page') ) ? get_query_var('page') : 1;
$display_count = 12;
$excluded_count = 1;
$offset = ( ($paged-1) * $display_count ) + $excluded_count;
$args = array(
'post_status'=>"publish",
'post_type'=>"post",
'orderby'=>"post_date",
'posts_per_page' => $display_count,
'offset' => $offset,
'paged' => $paged
);
$the_query = new WP_Query( $args );
if ( $the_query->have_posts() ) : ?>
<h3>Bisherige Artikel</h3>
<div class="recentpostsmasonry">
<?php while ( $the_query->have_posts() ) : $the_query->the_post(); ?>
<div <?php post_class('halb'); ?> id="post-<?php the_ID(); ?>">
<span class="head"><?php the_time('j. F Y') ?></span>
<h3><?php the_title(); ?></h3>
<div class="entry">
<?php the_excerpt(); ?>
<p class="more-link">Weiterlesen ...</p>
<p class="comments"><?php edit_post_link(__('Bearbeiten'), '', ' | '); ?> <?php comments_popup_link(__('Schreib den ersten Kommentar'), __('Ein Kommentar'), __('% Kommentare'), '', __('') ); ?></p>
</div>
</div>
<?php endwhile; ?>
</div>
<div class="navigation">
<span class="nextlink" title="Ältere Einträge"><?php next_posts_link( '«', 0 ); ?></span>
<span class="previouslink" title="Jüngere Einträge"><?php previous_posts_link( '»' ); ?></span>
</div>
<?php else : ?>
<h3><?php _e('Nichts gefunden :('); ?></h3>
<?php endif; ?>
</div>
<?php get_sidebar(); ?>
<?php get_footer(); ?>
New:
<?php get_header(); ?>
<div class="box blog-block">
<?php
$args = array( 'numberposts' => 1, 'post_status'=>"publish",'post_type'=>"post",'orderby'=>"post_date");
$postslist = get_posts( $args );
foreach ($postslist as $post) : setup_postdata($post); ?>
<span class="head"><?php the_time('j. F Y') ?></span>
<h3><?php the_title(); ?></h3>
<div class="entry">
<?php global $more;
$more = 1;
the_content();
?>
<p class="author"><?php the_author(); ?></p>
<p><a class="more-link" href="<?php the_permalink(); ?>#respond" title="<?php the_title();?>">Kommentieren</a>
</div>
<?php endforeach;
wp_reset_postdata(); /* 1. reset post data */
?>
</div>
<div class="box" id="recentposts">
<?php
$paged = ( get_query_var('page') ) ? get_query_var('page') : 1;
$display_count = 12;
$excluded_count = 1;
$offset = ( ($paged-1) * $display_count ) + $excluded_count;
$args = array(
'post_status'=>"publish",
'post_type'=>"post",
'orderby'=>"post_date",
'posts_per_page' => $display_count,
'offset' => $offset,
'paged' => $paged
);
$the_query = new WP_Query( $args );
if ( $the_query->have_posts() ) : ?>
<h3>Bisherige Artikel</h3>
<div class="recentpostsmasonry">
<?php while ( $the_query->have_posts() ) : $the_query->the_post(); ?>
<div <?php post_class('halb'); ?> id="post-<?php the_ID(); ?>">
<span class="head"><?php the_time('j. F Y') ?></span>
<h3><?php the_title(); ?></h3>
<div class="entry">
<?php the_excerpt(); ?>
<p class="more-link">Weiterlesen ...</p>
<p class="comments"><?php edit_post_link(__('Bearbeiten'), '', ' | '); ?> <?php comments_popup_link(__('Schreib den ersten Kommentar'), __('Ein Kommentar'), __('% Kommentare'), '', __('') ); ?></p>
</div>
</div>
<?php endwhile; ?>
</div>
<div class="navigation">
<span class="nextlink" title="Ältere Einträge"><?php next_posts_link( '«', $the_query->max_num_pages ); ?></span>
<span class="previouslink" title="Jüngere Einträge"><?php previous_posts_link( '»' ); ?></span>
</div>
<?php else : ?>
<h3><?php _e('Nichts gefunden :('); ?></h3>
<?php endif; ?>
</div>
<?php get_sidebar(); ?>
<?php get_footer(); ?>

Answer 1

You haven't set up paging, so your query always thinks its on page 1.
Also according to the WP Developer Resources , you shouldn't use query_posts- use WP_Query or pre_get_posts instead, so I'm using WP_Query below to do your 2nd query.
Note that I've assumed you are using this on a static homepage, but I've added the change required for a custom page in comments.
<?php
$args = array( 'numberposts' => 1,
'post_status'=>"publish",
'post_type'=>"post",
'orderby'=>"post_date");
$postslist = get_posts( $args );
foreach ($postslist as $post) : setup_postdata($post);
?>
// regular post html with wp tags
<?php endforeach;
wp_reset_postdata(); /* 1. reset post data */
?>
<?php
/* Set up your pagination - $paged will contain the current page, telling WP_Query which post to start with (e.g. #13 on page 2) */
$paged = ( get_query_var('page') ) ? get_query_var('page') : 1;
/* NOTE: if this is NOT on a static page
get the 'paged' query var instead of 'page', i.e.:
$paged = ( get_query_var('paged') ) ? get_query_var('paged') : 1;
*/
$display_count = 12; /* variable for the number of posts per page */
$excluded_count = 1; /* the number of posts excluded from the start position */
/* Calculate the offset, i.e. the post number to start the page with
Normally this is calculated by: ($paged-1) * $display_count
so we just need to add 1 for the one we excluded */
$offset = ( ($paged-1) * $display_count ) + $excluded_count;
/* set up your new query passing in the page so WP_Query knows what to return */
$args = array(
'post_status'=>"publish",
'post_type'=>"post",
'orderby'=>"post_date",
'posts_per_page' => $display_count,
'offset' => $offset,
'paged' => $paged
);
/* set up your new query */
$the_query = new WP_Query( $args );
<?php if ( $the_query->have_posts() ) : ?>
<h3>Headline</h3>
<?php while ( $the_query->have_posts() ) : $the_query->the_post(); ?>
// regular html with wp tags for these posts (teasers, with the_excerpt)
<?php endwhile; ?>
<div class="navigation">
<span class="nextlink"><?php next_posts_link( 'Older', $the_query->max_num_pages ); ?></span>
<span class="previouslink"><?php previous_posts_link( 'Newer' ); ?></span>
</div>
<?php else : ?>
<h3><?php _e('Nothing found'); ?></h3>
<?php endif; ?>
The above code is untested, but the basic logic should be right.
UPDATE:
next_posts_link and
previous_posts_link use the global variable $wp_query by default, so to make is use your custom query, pass $custom_query->max_num_pages into next_posts_link, e.g.:
<span class="nextlink"><?php next_posts_link( 'Older', $the_query->max_num_pages ); ?></span>
<span class="previouslink"><?php previous_posts_link( 'Newer' ); ?></span>