この記事には、コレクションリストというShopify要素についてご紹介します。
コレクションリスト要素について
コレクションリスト要素は、ページにコレクションリストを表示させてコンバージョン率を高めるために設計されている要素です。コレクションリスト要素を用いてコレクションの商品をアップセルしクロスセルすることができます。多くの魅力的なコレクションを表示させて、顧客に多くの選択肢を提供すると考えられます。 この要素により売上が押し上げられます。
コレクションリスト要素のアクセス方法
ステップ1:要素カタログでShopify要素追加機能である2つ目のアイコンをクリックします。
ステップ2:ドロップダウンメニューでコレクションリスト要素をクリックします。
ステップ3:対象の要素をページエディタにドラッグ&ドロップして使用します。
サイドバーメニューだけではなく検索機能を使用することで要素も見つけられます。
コレクションリスト要素の構成
コレクションリスト要素には、アピアランスを微調整して最高のコンバージョン率を取得できる多くのパラメータがあります。
レイアウントで要素を選択して含まれるパラメータを確認できます。
一般タブの構成
コンテンツ | |
コレクションソース:以下の2つのオプションから選択できます。
カスタムコレクション:表示するコレクションを選択します。 |
![]() |
読み込みごとのアイテム数:表示されるコレクションの数量を調整します。 | ![]() |
行ごとのアイテム数:行ごとのアイテム数を調整します。 | ![]() |
アイテム間の余白:アイテム間の余白を調整します。 | ![]() |
属性パラメータ、可視性パラメータ、アニメーションパラメータに関する詳細情報はこちらをご覧ください。
スタイリングタブの構成
スタイリングタブのユニバーサルパラメータの詳細情報については、こちらをご参照ください。
デバイス感度
コレクションリスト要素はノートパソコン、タブレット、モバイルを含む全てのデバイスでよく表示されるように作られた要素です。トップメニューでデバイス切り替りをクリックして閲覧したいデバイスを選択します。以下のサンプルをご覧ください。
「行ごとのアイテム数」は、ノートパソコンとタブレットに切り替えると、デフォルトとして4つですが、モバイルにすると、自動的に2つにセットされます。このオートメーションによりモバイルの表示がより明確かつ簡潔になります。「行ごとのアイテム数」、「読み込みごとのアイテム数」を各デバイスに変更できます。
以下はコレクションリスト要素に関するビデオチュートリアルです。