リンクリストを利用することで、手軽に関連リンクをページに追加することができます。今回はこのリンクリストで利用できるアイテムの上限について確認をしていきます。
リンクリストの動作確認
まずリンクリストを CMS 側で新しく作成をして、リンク一覧を作成します。今回は 15 個のリンクリストが入っている一覧を作成してみました。
これを実際にページに配置をすると以下のように表示されます。
アイテムを15個作成しているのですが、10個しか表示されていません。
原因を調べる
このリンクリストがどういう風に動作しているのかを確認します。このリンクリストのための Rendering の定義は、/sitecore/layout/Renderings/Feature/JSS Experience Accelerator/Navigation/LinkList となっています。
このアイテムでは GraphQL が定義されており、指定したデータソースのアイテムの下にある項目 children を見るようにしているのが分かります。この GraphQL のクエリに対して値を渡して取得する結果を Postman で確認をすると以下のようになります。
このように、デフォルトでは子アイテムを取得する場合には、 10 取得するのが標準の設定となっています。これを増やす場合、first: 20 とクエリを追加することで標準以上の数のデータを取得できるようになります。
query TitleQuery($datasource: String!, $language: String!) {
datasource: item(path: $datasource, language: $language) {
children (first: 20){
results {
field(name: "Link") {
link: jsonValue
}
}
}
field(name: "Title") {
title: jsonValue
}
}
}
Postman で実行すると、15 個のデータを取得できるようになりました。
環境に反映させる
上記で動作したクエリを Link List のアイテムに対して適用して、先ほど配置したページにアクセスをすると 15 個のアイテムが表示されるようになりました。
まとめ
以前にパンくずリストを作成する際にも、レンダリングに GraphQL の定義をしてデータの取得、ページで表示する形で実装できます。今回は、仕組み的にどこで問題があるのか?という形で Postman を利用してデータの取得の確認、そこを変更するだけで済みました。