-1

So what I want to do is have a wordpress content area that will display the next post when a link is clicked. I have this as my post query

<?php
$args = array();
$lastposts = get_posts( $args );
foreach ( $lastposts as $post )
{
  setup_postdata( $post );
  $posts[] += $post->ID;
}
$current = array_search(get_the_ID(), $posts);
$prevID = $posts[$current-1];
$nextID = $posts[$current+1];

?>

Then I have this as the pagination links

<?php if (!empty($prevID)) { ?>
    <li class="previous">
    <a class="panel" href="<?php echo get_permalink($prevID); ?>" title="<?php echo get_the_title($prevID); ?>">&larr; Older</a>
    </li>
 <?php }
 if (!empty($nextID)) { ?>
    <li class="next">
    <a class="panel" href="<?php echo get_permalink($nextID); ?>" title="<?php echo get_the_title($nextID); ?>">Newer &rarr;</a>
    </li>
 <?php } ?>

I can't figure out how to tell the guts of a post (the_permalink, the_content) to display the next post. My goal is to add some sort of transition but that is not as important as having the next post show up. Any ideas, is it even possible?

  • Thanks for the answer. Not sure why someone would demote my question but whatever. This is similar to what I am using now for the slider function, the problem is getting wordpress to recognize that the next slide should contain the contents of the next post. Im going to try and create a mask and then have 5 elements hidden. Then see if adding the $nextID argument to the wp_content function will work. If anyone knows of a better way please let me know. – Larry Tinnon Jr. Nov 13 '13 at 01:29

2 Answers2

0

I have always hated Carousels and sliders but this particular slider has always been my go to as it's super easy and very customizable.

jcarousellite is the name of it and it majestic. Heres is the website http://www.gmarwaha.com/jquery/jcarousellite/

If you have a basic understanding of css you will love this but heres an example mockup.

<head>
<title>Test</title>
<script type="text/javascript" src="http://code.jquery.com/jquery-latest.pack.js"></script>
<script type="text/javascript" src="http://www.gmarwaha.com/jquery/jcarousellite/js/jcarousellite_1.0.1.js"></script>
</head>
<body>
<button class="prev"><<</button>
<button class="next">>></button>

<div class="anyClass">
    <ul>
        <li><img src="someimage" alt="" width="100" height="100" ></li>
        <li><img src="someimage" alt="" width="100" height="100" ></li>
        <li><img src="someimage" alt="" width="100" height="100" ></li>
        <li><img src="someimage" alt="" width="100" height="100" ></li>
    </ul>
</div>

<script type="text/javascript">
$(function() {
    $(".anyClass").jCarouselLite({
        btnNext: ".next",
        btnPrev: ".prev"
    });
});
</script>
</body>

In this I would host at least the jcarousellite.js file on your server as theres a bunch of settings in there to play around with like showing 1 image at a time, but I hope this helps you! Don't forget you can add id's to the buttons to make them look nice and wrap everything in css to make it look sexy.

0

replace the li's in the middle with this

<?php 
  $thumbnails = get_posts('numberposts=5');
  foreach ($thumbnails as $thumbnail) {
    if ( has_post_thumbnail($thumbnail->ID)) {
      echo '<li><a href="' . get_permalink( $thumbnail->ID ) . '" title="' . esc_attr( $thumbnail->post_title ) . '">';
      echo get_the_post_thumbnail($thumbnail->ID, 'medium');
      echo '</a></li>';
    }
  }
?>