Glitch in WordPress single.php Infinite Scroll/Pagination Loop

I’ve created a quick pagination on a single.php file in order to use infinite scroll in a loop at the bottom of the page. Here’s the code I used to create my ‘nextSelector’ and ‘navSelector’ for the infinite scroll:

<?php
    $next_url = $_SERVER['REQUEST_URI'].'2';
?>

<ul class="single-pagination">         
     <li><a class="next pagination-item" href="<?php echo $next_url; ?>/">Next</a></li>
</ul><!--single-pagination-->

This works fine because it creates the ‘next ‘ page to get the infinite scroll started. My navSelector in the infinite scroll is ul.single-pagination and my nextSelector is a.next.pagination-item. This all works fine on most pages but when I visit a page that has a number at the end of the URL, the infinite scroll changes the number instead of changing the appended number on the URL. For example, if I had a URL like this:

Read More
http://www.example.com/this-post-2/

It would load the first iteration of the infinite scroll successfully, which would be:

http://www.example.com/this-post-2/2/

and then on the next iteration would throw a 404 error on this URL:

http://www.example.com/this-post-3/2/

Though it should be looking for:

http://www.example.com/this-post-2/3/

Short of breaking apart the JS code for the infinite scroll, is there any way to customize the URL that the infinite scroll look for?

EDIT

This is related to the RegEx expression in the jquery.infinitescroll.min.js that is altering the URL. Here is the code that I am working on altering. I will post the answer here if no one beats me to it:

t = t.match(/^(.*?)b2b(.*?$)/).slice(1);

Related posts

Leave a Reply

1 comment

  1. The solution to this lies in the jquery.infinitescroll.js (or jquery.infinitescroll.min.js file). The RegEx that the author used on this does not take into account these types of URLs.

    I created a fork of the code in my GitHub account that can be accessed here:

    https://github.com/MillerMedia/infinite-scroll

    Basically, a RegEx expression of this:

    t = t.match(/^(.*?2)b2b(.*?$)/).slice(1);
    

    Is placed before this one:

    t = t.match(/^(.*?)b2b(.*?$)/).slice(1);