Shopify、フィルタリングされた製品リストの進むボタンと戻るボタン

Question

コレクションページの商品ページに表示される進むボタンと戻るボタンを作成しようとしています。コレクションページでフィルターを選択し、商品をクリックすると、ユーザーが選択したフィルターに基づいて、リストされた商品間を進む、または戻るボタンを作成したいと考えています。私のボタンは、コレクションページ全体を前後に移動するだけです。フィルターに基づいてリストされた製品を処理するには、以下のコードを書き直すにはどうすればよいですか?

リーリー

インターネットで検索しましたが、結果が見つかりませんでした。

P粉761718546 · Answer

ヒントについては、この古い記事 Shopify: コレクションで最高価格のアイテムを入手するをご覧ください。

基本的には、スクリプトを使用してページの document.referrer の検索パラメーターからフィルターを検出し、スクリプトを通じてフィルターを再実行します。フィルタリングされた製品をスクロールし、製品が見つかったら、クライアント側で「前へ」ボタンと「次へ」ボタンを再構築して、正しい製品を指すようにすることができます。

window.sessionStorage を使用して、スクリプト化されたフィルターの製品 ID を順番にキャッシュできるため、新しいページが読み込まれたときにキャッシュ (キーが現在のフィルターパラメーターである) を確認でき、製品が見つかった場合は、検索をスキップできます。

キャッシュルーティングを使用する場合は、ある種の最新性基準も設定する必要があります。