複数のページネーションブロックの挙動について

解決済 otomotomotom
(@otomotomotom)

10ヶ月、 3週前

【現状】

現在、WordPressにてTT3ベースの子テーマでFSEの自作のテーマを作成しております。
実績一覧のページを固定ページにて作成しております。
ページの内容としましては、全ての投稿、2つのカテゴリーの計3つの一覧を別途記述のjsにてタブでパネルを切り替えるページになります。
大枠のグループ内にクエリーループブロックを3つ配置し、投稿全てを表示させるパネル x1、クエリーブロックの設定欄にてカテゴリーの絞りこみをしたパネル x2で構成しており、いずれも投稿タイプ『投稿』で並び順は最新からとなっております。

【困っていること、試したこと】
クエリーループそれぞれにページ送りブロックが設置されており、それぞれのパネルごとに独立したページ送りとなって欲しいのですが、その辺りの挙動がおもわしくありません。

実際の例としましては、
2つのカテゴリーを合わせた投稿、B,A,A,A,B,A,A,B,B,B,B,B,A (現段階で12個) を全て表示させるパネル(1)があり、他の2つのパネル(2,3)でそれぞれのカテゴリーを表示させています。いずれもクエリーループブロックの表示設定で『ページごとの項目』は10、その他の欄は0に設定。更にダッシューボードの設定内の表示設定も10に設定しています。

挙動としましては、
表示件数を指定した事で表示されるページネーションブロックの2ページ以降を押した状態で、タブを押して他のパネルを表示させると内容が表示されない状態です。別のカテゴリーパネルを表示させた時にページネーションブロックが1から始まって欲しいのですが、先のページネーションの影響を受け表示させたパネルもページネーションが2となっています。

例
全体ページの2ページ目でB,Aを表示させた状態で他のパネルを押すと何も表示されない。パネル2、3共に現段階では6件の為、投稿数10以上でない為に表示されていない気が致します。
パネル1の1ページ目から他のパネルを表示した際には順番通りに並んでいるので、クエリーループブロックの絞りこみ自体は正しい状態であると思われます。
クエリーループブロックの表示件数を変えてみたりなどのテストも行い、パネル2や3のページネーションの1やprev/nextを選ぶとパネル1に飛んでしまう状態です。

その他、制御する方法をフォーラムやGoogleで色々と検索したのですが、FSEでの制作で近いケースに該当するものがあまりない上に、基本的な知識が乏しい為にどの様なアプローチをすべきかの判断が付かずに困っております。

【解決したいこと】
それぞれのパネルを選択、表示させた際にページネーションを1ページ目から表示させて他のパネルの影響を受けないようにしたい。

分かりにくい説明かとは思いますが、お知恵を拝借できれば幸いです。

5件の返信を表示中 - 1 - 5件目 (全5件中)

Aki Hamano
(@wildworks)

10ヶ月、 3週前
こんにちは。

投稿いただいた内容はFSEやクエリーループブロックの問題というよりは、WordPressの仕様によるものだと思います。

ページネーションのリンクURLは、例えば「http://example.com/page/2/」のようになります。ページネーションは、それがブロックであるかどうかにかかわらず、このURLをパースして現在どのページにいるかを判断するしかありません。

なので、クエリーループ内にページネーションを設置したとしても、全てのページネーションが現在のページとして同じページを示してしまうという理由だと思います。

実際にやった事はありませんが、ざっくりと思いつくアプローチとしては以下です。どちらもかなり難度は高いと思いますが、試してみて下さい。

【カスタムブロックを作る】
- タブ・ページネーションを含めて、複数のクエリーループブロックを一つのブロックとして開発する。
- ダイナミックブロックとして開発し、フロントエンド側はPHPでダイナミックレンダリングする。
- ページネーションを生成するpaginate_links()関数は追加パラメータを含められるので、カテゴリーを表すパラメータを追加する。
- 同時に、追加したパラメータ（cat=XXX等）を参照して、pagintate_links()関数のcurrentプロパティ等を自前でコントロールする。
【JSで制御する】
- クエリーループブロックのブロックバリエーション等で、perPageを全件表示（-1）にする。
- フロントエンドで各タブに表示された全件表示の投稿を、CSS or JSを使って最新のN件以外は非表示にしておく。
- ページネーションブロックは使わない。取得した投稿件数から、ページネーションを自前で生成する。
- ページネーションの数字をクリックした時のJSイベントで、表示するページのオフセットを切り替える
【ページネーションは諦める】

前述の2つのアプローチはそれなりに工数もかかり難度も高いので、「それぞれのタブ内には最新N件のみ表示、ページネーションは表示しない」という仕様に変更するのも考えてみてもよいかもしれません。
トピック投稿者 otomotomotom
(@otomotomotom)

10ヶ月、 3週前

Aki Hamanoさま

こんにちは、大変分かりやすい投稿誠に有難うございます。

WordPressの仕様と云う事で納得致しました。
また、全てのページネーションが現在のページとして示すとの事で、発生している状況に照し合わせてみても正にその様な状況です。

まずは、ご提案頂いたアプローチを一つずつ手探りでテストしてみたいと思います。
現在は暫定的にページネーションを使用せず、それぞれのパネルの投稿を全て表示しております。問題なく絞り込みもされているのですが、投稿件数が増えてくるとやはりどうにかページを分ける必要がありそうで頭を抱えております。
知識と技術が乏しい故、JSで制御する、もしくはページネーションを使わないのが私にとっては現実的な気が致します。

なんとか修正次第、詳細を投稿させて頂きたいと思います。
大変参考になる丁寧なご説明とアイデアを頂きまして誠に有難うございました。
nobita
(@nobita)

10ヶ月、 2週前
こんにちは、

複数クエリーページングは、クラッシック時代から、いろいろ試みが行われてきたところですね。

以下の赤字で囲んだところの設定がONになっていたら、OFFにしてみてください。

https://www.tenman.info/wp3/emulsion/files/2023/06/image-7.png

OFFにすると、ページネーションリンクは以下のようになります。
```
https://www.example.com/wp/?query-31-page=2
```
ONだと以下ですが、
```
https://www.example.com/wp/page/2/
```
ONのクエリーループとOFFが混在した場合には、
```
https://www.example.com/wp/page/3/?query-31-page=3
```
十分なテストをしたことはなく、Sticky Postがある場合には、2ページ以降でも表示されるといった問題はあるようです。

何かお役に立てば、、、、
トピック投稿者 otomotomotom
(@otomotomotom)

10ヶ月、 2週前

nobitaさま

こんにちは。
貴重な情報を頂き誠に有難うございます。

1ページ内に3つのカテゴリー一覧を内包しタブパネルで表示を切り替えると云う、無理のある設計なのは痛感しているところです。
この様な設計の為、それぞれのクエリーループの設定でテンプレートからクエリーを継承をOFFにした上で、絞り込み欄でカテゴリーを指定し3つの一覧を分けております。

なかなかにややこしい(恐らくはシンプルな事なのだとは思うのですが)複数クエリーページングの決まり事を十分に理解していなかった事もあり、複数クエリーループが設置されたページネーションの扱いをきちんと整理したいと考えております。

参考画像、例もご用意頂きまして誠に有難うございました。
ON/OFF時のページネーションリンクの変化が理解でき、大変参考になりました。

トピック投稿者 otomotomotom
(@otomotomotom)

10ヶ月、 2週前

Aki Hamanoさま

こんにちは。

ご教授頂いた内容を元に改善致しましたので、報告させて頂きます。
ページネーションの仕様を踏まえて今回は難しい事をせず、シンプルに全投稿とカテゴリー一覧のテンプレートでリンクを跨いで表示させる事でページネーションも意図した通りに動いてくれる様になりました。
1ページ内にページネーション付きの複数カテゴリー一覧を表示させると云う、セオリーから外れた無理な仕様である事を気付かせて頂きました。
頂いた様々なアプローチと共に大変感謝しております。

また、分かりやすいQiitaのポストほか、いつも参考にさせて頂いております。
この度は誠に有難うございました。

5件の返信を表示中 - 1 - 5件目 (全5件中)

トピック「複数のページネーションブロックの挙動について」には新たに返信することはできません。

トピックタグ

表示