Take the 2-minute tour ×
WordPress Development Stack Exchange is a question and answer site for WordPress developers and administrators. It's 100% free, no registration required.

Enabling infinite scrolling is as simple as adding this snippet to the theme's functions.php file (where 'content' is the id of the container that wraps the posts):

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

But what should I do if my website has a multiple column layout where, for instance, one column shows the latest posts, and the other column lists the latest posts from a tag (highlights)? i.e. essentially there are two containers.

I tried these two snippets (see below), and either way, infinite scrolling is only enabled for one column/container.

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

add_theme_support( 'infinite-scroll', array(
    'type' => 'scroll',
    'container' => 'highlights',
    'footer' => false,
) );

and

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

What am I doing wrong?

NOTE: If the fact that installing Jetpack requires a wordpress.com account is holding you back, please try Slim Jetpack. It even works on a local install of WP, and doesn't require a wp.com account.

share|improve this question
add comment

2 Answers

up vote 1 down vote accepted

In an email response, Kris Karkoski, Happiness Engineer (WordPress.com) at Automattic told me, "Infinite Scrolling with multiple columns is not supported in Jetpack at this time."

share|improve this answer
add comment

I've checked the source code for Slim Jetpack and this task can not be accomplished without rewriting that plugin.

Here are some hints:

  1. You'll have to duplicate line 539 of '/modules/infinity-scroll/infinity.php' stating:

    jQuery.extend( infiniteScroll.settings.scripts, <?php echo json_encode( $scripts ); ?> );
    
  2. You'll have to duplicate line 475 of '/modules/infinity-scroll/infinity.js' as this initializes infinite scroll. (Do you see the variable name match?)

    infiniteScroll.scroller = new Scroller( infiniteScroll.settings );
    
  3. What's more, you'll have to tweak the module to accept more attributes, or at least post_type attribute to be able to determine what post_type to bring for each inifinite loop -- this must be done in both JS and PHP (callback for ajax function).

As I've said, the plugin would have to be rewritten.

share|improve this answer
add comment

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

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