skip to Main Content

I want to display one post at a time inside a div and replace the content to display the next (adjacent) post’s content on the click of a button.

I am currently looping through the posts using wp_query, but all posts are displayed stacked on top of each other.

query_posts($args);
$temp = $wp_query;
$wp_query = new WP_Query( $args );
$count = $wp_query->post_count;
$i = 1;
if ( $wp_query->have_posts() ) :
    while ( $wp_query->have_posts() && $i < 9) : $wp_query->the_post();
?>

I am pulling in the following content:
<?php echo $i?> / <?php echo $count?>
<?php the_title();?>
<?php the_content();?>

I also have a conditional surrounding the button to pull in the adjacent link’s permalink, but it is grabbing the entirety of the permalink when I only need the post’s slug. I’m imagining something like this, but it doesn’t work:
$next_slug = get_slug(get_adjacent_post(false, '', false));

2

Answers


  1. This is essentially AJAX navigation through posts. This answer should be able to do what you’re asking.

    Login or Signup to reply.
  2. <?php  while ( have_posts() ) : the_post(); ?>
        <article id="post-<?php the_ID(); ?>" <?php post_class(); ?>>
            <?php the_title( '<h1>','</h1>' );  ?>
            <div class="post-thumbnail"><?php the_post_thumbnail(array(250, 250)); ?> </div>
            <div class="entry-content"><?php the_content(); ?></div>
            <div class="btn"><?php next_post_link('%link', '%title'); ?></div>
        </article>
    <?php endwhile; ?>
    
    </div>
    
    Login or Signup to reply.
Please signup or login to give your own answer.
Back To Top
Search