ストアフロントに商品コレクションを表示する方法

Prev Next

商品コレクションを使用すると、関連する商品をグループ化できるため、顧客が商品を見つけて購入しやすくなります。これらのコレクションを店舗のフロント ページに表示すると、ショッピング エクスペリエンスが向上し、売上が増加します。この記事では、ストアフロントページの「商品コレクション」やその他の高度な要素を使用して商品コレクションを紹介する方法を学びます。

Store Collection Block

大事な

製品コレクションは、ClickFunnelsストアでのみ販売されています。目標到達プロセス内に個別の商品として追加することはできません。


必要条件

  • アクティブなClickFunnelsアカウント

  • ワークスペースに追加された Store アプリ

  • At least one product collection created

  • 「商品コレクション」に含まれる各商品が オンラインストアに表示されるように設定されていることを確認します。


商品コレクションの作成と設定

ストアフロントに商品コレクションを表示する前に、商品コレクションを作成する必要があります。手順の概要は次のとおりです。

  1. [商品] メニューに移動し、サブメニューから [コレクション] を選択します。

  2. コレクションの作成」 をクリックし、コレクションの名前、説明、画像などの必要な詳細を入力します。

  3. コレクションに含める商品を追加したことを確認してください。

製品コレクションの作成と管理に関する詳細なガイドについては、記事を参照してください How to Create and Manage a Product Collection


「製品コレクション」要素を使用した動的レイアウトの構築

ワークスペースのすべての商品コレクションをストアフロントに表示するには、次の手順に従います。

  1. 左側のナビゲーション メニューで、 ストア アプリをクリックし、[ 概要] を選択します。

  2. [ デザインストア ] をクリックして、ストアテーマエディターにアクセスします。

  3. 左側のナビゲーションで [ストア フロント] ページが選択されていることを確認します。

  4. エディター内で、 セクションを追加し、そのセクション内に を追加します。行内のオレンジ色の +プラス または[新しい要素を追加]ボタンをクリックして、新しい要素を挿入します。

    Add Section, row and element

  5. 右側の要素メニューから、[ 商品コレクション] を選択します。

  6. 「製品コレクション」要素を追加すると、コンテナ内に追加する列の数を選択するように求められます。標準は 1 列ですが、設計の好みに基づいてさらに多くの列を選択できます。


コンテナに動的な高度な「製品コレクション」要素を追加する

「商品コレクション」要素とコンテナ内に行を追加すると、システムは商品コレクションの高度な個々の要素を強調表示します。これらの要素には、名前、説明、画像、リンクが含まれます。これらの要素を追加およびカスタマイズする方法は次のとおりです。

Advanced Product Collection Elements

  • 名前: 製品コレクションの名前を表示する 名前 要素を追加します。

  • 説明: コレクションの説明を表示する Description 要素を追加します。

  • 画像: コレクションの画像を表示する Image 要素を追加します。

  • リンク: リンク 要素を追加して、行動を促すフレーズボタンを提供します。クリックすると、システムはそれらを関連製品コレクションページにリダイレクトします。

これらの個々の要素を挿入した後、各要素の設定に移動して、好みに応じてデザインとレイアウトをカスタマイズできます。ストアのテーマに合わせて色、フォント、サイズを調整し、統一感のある外観を確保します。

Advanced Product Collections Elements