load next and previous posts by Ajax and URL update

by

In my wordpress site, I have next/prev link in single.php , I want to ajaxify them and i found below script and it’s working but it’s not changing the new post URL(URL not updaing). After 2 hours searching i am unable to find similar solution.

Here is the code of my single.php

<?php while ( have_posts() ) : the_post(); ?>
<div id="content" class="row">
    <div id="contentInner">
       Single post show here
    </div>
    <ul id="post-nav">
        <li class="prev"><?php previous_post_link( '%link', '<span>'. __( '<i class="fa fa-angle-double-left" aria-hidden="true"></i>', 'tie' ).'</span> %title' ); ?></li>
        <li class="next"><?php next_post_link( '%link', '<span>'. __( '<i class="fa fa-angle-double-right" aria-hidden="true"></i>', 'tie' ).'</span> %title' ); ?></li>
     </ul>
</div>
<?php endwhile; ?>

And here is the code of my javascript

$(document).on('click','#post-nav a', function(e){
    e.preventDefault();
    var link = $(this).attr('href');
    $('#content').html('<span>Loading post...</span>');
    $('#content').load(link+' #contentInner');
});

It’s working nice but url didn’t change 🙁 I want to change the URL when new post loaded. Please help me i have no idea how to solve this

0

Leave a Comment