Roots Sage with Jetpack Infinite Scroll

Hey, I’m trying to add Jetpack to my Roots Sage theme. Has anyone had any luck with this? I tried adding this to the functions.php file

add_theme_support( 'infinite-scroll', array(
    'type'           => 'scroll',
    'footer_widgets' => false,
    'container'      => 'content',
    'wrapper'        => true,
    'render'         => false,
    'posts_per_page' => false,
) );

I’m kind of clueless at this point. Any guidance is much appreciated. My site is here:

http://dev-the-best-sites.pantheonsite.io/category/entertainment/

This is how I got it working on one recent site. I had to use the “render” callback function to iterate through the loop and use sage (9) template function. I hope it helps you figure it out!

    // Add support for Jetpack's Infinite Scroll
    add_theme_support('infinite-scroll', [
        'container' => 'main',
        'footer' => false,
        'type' => 'scroll',
        'wrapper' => false,
        'posts_per_page' => 12,
        'render' => __NAMESPACE__ . '\\infinite_scroll',
    ]);

    function infinite_scroll()
    {
        echo '<div class="container-inner">';

        while (have_posts()) : the_post();
            echo template('partials.content-' . get_post_type());
        endwhile;

        echo '</div>';
    }
2 Likes

Thank you for the response Patrick. I still can’t get it to work. I’m not even seeing the AJAX trigger. Do you have your project as a Fork of Roots Sage?

I’m getting this as the AJAX return response now that I figured out to have the right ID in the infinite scroll theme settings:

<div class="container-inner">
Fatal error: Uncaught Error: Call to undefined function template() in /srv/bindings/246aeb04101f42269881bfa2eee7538a/code/wp-content/themes/tbs/resources/functions.php:110
Stack trace:
#0 /srv/bindings/246aeb04101f42269881bfa2eee7538a/code/wp-includes/class-wp-hook.php(298): infinite_scroll('')
#1 /srv/bindings/246aeb04101f42269881bfa2eee7538a/code/wp-includes/class-wp-hook.php(323): WP_Hook->apply_filters('', Array)
#2 /srv/bindings/246aeb04101f42269881bfa2eee7538a/code/wp-includes/plugin.php(453): WP_Hook->do_action(Array)
#3 /srv/bindings/246aeb04101f42269881bfa2eee7538a/code/wp-content/plugins/jetpack/modules/infinite-scroll/infinity.php(1262): do_action('infinite_scroll...')
#4 /srv/bindings/246aeb04101f42269881bfa2eee7538a/code/wp-includes/class-wp-hook.php(298): The_Neverending_Home_Page->query('')
#5 /srv/bindings/246aeb04101f42269881bfa2eee7538a/code/wp-includes/class-wp-hook.php(323): WP_Hook->apply_filters('', Array)
#6 /srv/bindings/246aeb04101f42269881bfa2eee7538a/code/wp-includes/plugin.php(453): WP_Hook->do in /srv/bindings/246aeb04101f42269881bfa2eee7538a/code/wp-content/themes/tbs/resources/functions.php on line 110

Could you send me the template() function?

This did the trick:

function infinite_scroll() {
while (have_posts()) : the_post();
echo \App\template( ‘partials.content’ );
endwhile;
}

1 Like

you would have to use template() in a file inside the namespace App;