2

I have a custom theme where I've tried to integrate the Infinite Scroll option within JetPack. Per this article, I've added the following code to functions.php (in addition to activating the module) -

<?php 
    add_theme_support( 'infinite-scroll', array(         
    'container' => 'content',         
    'footer' => 'page',       
) );
?>

The live site can be found here.

My problem is that the infinite scroll function doesn't seem to be, well, functioning. Pagination still occurs when 10 posts are reached.

I'm not exactly sure where I've gone wrong as I followed the articles steps as they were written. Any ideas?

2 Answers 2

2

Have you tried adding 'type' => 'click' under 'footer' => 'page', to see if the Jetpack works with click rather than the default scroll?

It is also worth going to Settings -> Reading in the admin panel... does it say "To infinity and beyond....We've disabled this option for you since you have footer widgets in Appearance → Widgets, or because your theme does not support infinite scroll."? You might look at what it says here before trying the above step. If you get this error it might be a conflict between your footer and the scroll.

I think your container might also need to be 'blog' and not 'content', as the div your posts are held in seems to be #blog.

5
  • Changed the container to 'blog', thank you for spotting that. Adding 'type' => 'click' generated the "Older Posts" button, however that button did nothing - clicked, spinning 'loading' wheel, then nothing. In the admin panel, Settings > Reading > Blog pages show at most still shows 10.. which I'm assuming means that there is indeed a conflict. What might this conflict be? Commented Dec 10, 2013 at 22:57
  • If you right click on your page and Inspect Element in Chrome/Firefox, you'll see that when you click on the button, a new div is being added each time - with the class .infinite-view-2, .infinite-view-2 etc... Normally there would be posts appearing inside those divs, however currently there is some javascript inside each which starts with var disqus_shortname = 'veblenhigh';, does this mean anything to you?
    – Sarah
    Commented Dec 11, 2013 at 7:18
  • Are you using a plugin called Disqus? Try disabling it and see if the Infinite scroll works then. I think this might be a similar problem to what you're having, although it's for an unrelated issue: wordpress.org/support/topic/…
    – Sarah
    Commented Dec 11, 2013 at 7:20
  • I am using the Disqus plugin; after disabling the plugin and clearing the cache I've noticed no changes to the site/scrolling. Commented Dec 11, 2013 at 22:58
  • ETA - following the directions on the linked WP Support thread resulted in no noticeable changes. Commented Dec 11, 2013 at 23:36
1

For those of you having trouble with this, it is because there is no render function. Add the following to your functions.php file:

add_theme_support( 'infinite-scroll', array(
    'container'      => 'blogroll', 
    'footer'         => false,
    'posts_per_page' => 1,
    'type'           => 'click',
    'render'         => 'wb_infinite_scroll_render',
) );

function wb_infinite_scroll_render() {
    get_template_part( 'templates/content-post', 'standard' );
}

Change the name of the container to the name of the container you want the posts to populate in.

Also -- I have a folder named "templates" in my theme with a content-post-standard.php file within there that allows me to print out everything I need.

Hope this helps!

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.