web-dev-qa-db-ja.com

同じページ上の複数の列のJetpack無限スクロール?

無限スクロールを有効にすることは、テーマのfunctions.phpファイルにこのスニペットを追加するのと同じくらい簡単です( 'content'は投稿をラップするコンテナのidです)。

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

しかし、たとえば、ある列に最新の投稿が表示され、別の列にタグからの最新の投稿が表示される(ハイライト)、Webサイトに複数列のレイアウトがある場合はどうすればよいですか。すなわち、本質的に2つの容器がある。

これら2つのスニペットを試してみました(下記参照)。どちらの方法でも、無限スクロールは1つの列/コンテナに対してのみ有効です。

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

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

そして

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

何がおかしいのですか?

注:Jetpackのインストールにwordpress.comアカウントが必要であるという事実があなたを阻んでいるのであれば、 Slim Jetpack を試してください。それはWPのローカルインストールでさえ動作し、そしてwp.comアカウントを必要としません。

4
its_me

AutomatticのHappiness Engineer(WordPress.com)のKris Karkoskiが電子メールの返信で、次のように述べています、"現在、Jetpackでは複数の列を含む無限スクロールはサポートされていません。"

0
its_me

Slim Jetpackのソースコードを確認しましたが、このタスクはそのプラグインを書き直さなければ達成できません。

ヒントを次に示します。

  1. '/modules/infinity-scroll/infinity.php'の539行目を複製する必要があります。

    jQuery.extend( infiniteScroll.settings.scripts, <?php echo json_encode( $scripts ); ?> );
    
  2. これにより、無限スクロールが初期化されるため、「/ modules/infinity-scroll/infinity.js」の475行目を複製する必要があります。 (変数名が一致していますか?)

    infiniteScroll.scroller = new Scroller( infiniteScroll.settings );
    
  3. さらに、より多くの属性を受け入れるためにモジュールを微調整するか、少なくともpost_type属性を使用して、各無限ループにどのpost_typeをもたらすかを決定する必要があります。これは、JSとPHP(ajax関数のコールバック)。

私が言ったように、プラグインは書き直さなければなりません。

2
david.binda