1

I'm developing my own theme and added this in a function which is called with the hook after_setup_theme to support infinite scroll:

add_theme_support( 'infinite-scroll', array(
    'container'  => 'content',
    'footer' => false,
    'wrapper' => false
) );

I got this from http://jetpack.me/support/infinite-scroll/. content is the id of the container the new posts should go in. footer is set to false since I don't want another footer to be added. wrapper is set to false because I don't need a div wrapper.

When I go to my webpage and scroll to the bottom, there is a loading anymation, but there are no posts loaded (there are more posts though). I see that there is a javascript error:

TypeError: infiniteScroll.scroller is undefined at infinity.js:485

I also see there is an ajax request when I scroll to the bottom, but that page returns:

{"type":"empty"}

What am I doing wrong? How can I get this working?

2 Answers 2

4

You need either a content.php or content-<post format>.php OR use a render:

add_theme_support( 'infinite-scroll', array(
    'container'  => 'content',
    'footer' => false,
    'render' => 'render_function',
    'wrapper' => false
) );

function render_function() {
    get_template_part('loop');
}

This implies you have a loop.php.

9
  • Would be nice if you linked to the relevant documentation... What does the render argument is about? ::::::::: I also saw the 500 error @Otto mentioned, was it related?
    – brasofilo
    Jan 31, 2013 at 16:26
  • No it wasn't, my question was about the code I listed and not about the code on my blog. I got this from the earlier mentioned link in which I took a deeper dive.
    – user26607
    Jan 31, 2013 at 16:30
  • The Answer is for the general public, even if the link is on the Q or here in the Comments, having it in the A itself makes it more complete... but up to you...
    – brasofilo
    Jan 31, 2013 at 16:41
  • I had assumed you had read my tutorial on this from the start, creating a content.php and adjusting your main Loop is the first step: ottopress.com/2012/jetpack-and-the-infinite-scroll . And your code above is wrong, you don't need a render function, and calling loop.php from it is incorrect anyway.
    – Otto
    Jan 31, 2013 at 17:23
  • Well it works. I don't say you have to use this, I just say this is a working solution. Also, you never linked to your tutorial before, so why on earth assume I read it!?
    – user26607
    Jan 31, 2013 at 17:27
3
+25

Most likely, your theme is missing either the wp_head() call in the header.php (add it right before the </head>), or the wp_footer() call in the footer.php (add it right before the </body>).

4
  • Thanks. My wp_footer() was called after the </html> so I changed that, but it still doesn't work. The wp_head() is located well.
    – user26607
    Jan 30, 2013 at 6:47
  • 1
    Took a look at your blog, and your site is throwing 500 errors when the infinite scroll is called. This is likely an .htaccess or other server configuration problem. Try disabling plugins that might be interfering, and if you have anything strange in your config, try removing those.
    – Otto
    Jan 30, 2013 at 8:26
  • That's because I'm still developing. My question is about the code listed, the code on my website isn't always the same. But I deactivated all plugins (except Jetpack) and it still didn't work. I never touched my wp-config.php. Same story for the .htaccess.
    – user26607
    Jan 31, 2013 at 6:39
  • Have you called infinity.js in your wp-head or in functions ? And did you check it properly ?
    – M3o
    Jan 31, 2013 at 15:39

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy