商品詳細ページのデザイン
商品の詳細ページはアプリ内ショッピング体験において重要な役割を果たします。設計がしっかりとされた商品ページは、明確で魅力的な商品情報を提供することでコンバージョン率を向上させることができます。デザインエディターでは、お知らせバナーや商品レコメンド、最近閲覧したアイテムなどの要素をカスタマイズして、商品の詳細ページを最適化することができます。このガイドでは、セットアップ手順と利用可能なカスタマイズオプションについて説明します。
商品ページの設定手順
アプリの商品詳細ページを設計するには:
- SHOPLINEの管理画面で、チャネル > ショッパーアプリ > アプリデザインに移動し、デザインをクリックしてデザインエディターを開きます。
- 上部のドロップダウンメニューから、商品詳細ページを選択し、必要な設定を構成を開始します。
- デザインを最終確認した後、保存をクリックして下書きを保存するか、適用をクリックして変更を即座に公開します。
利用可能な設定オプション
このセクションでは、商品詳細ページの構成可能な設定について説明します。
Note: お知らせバーと商品情報のコンポーネントは固定されており、順番を変更することはできません。他のコンポーネントは自由に配置して必要に応じて調整できます。 |
プレビュー商品の選択
商品詳細ページエディターを開くと、プレビューエリアには自動的にショッパーアプリ販売チャネルに割り当てられた最初の商品が表示されます。プレビュー目的のために他の商品に切り替えるには、ドロップダウン矢印をクリックします。
Note: ショッパーアプリチャネルに作成された商品がない場合、プレビューエリアに利用可能な商品がありませんというメッセージが表示されます。 |
お知らせバーの構成
お知らせバーは商品詳細ページの上部に表示され、ホームページのお知らせバーと同期するか、独立して構成することができます:
- ホームページのお知らせバーと同期: ホームページからテキスト、色、その他の設定を引き継ぎ、変更することはできません。
- 独立して設定: お知らせのテキスト、色、公開時間をカスタマイズできます。特定のお知らせを表示または非表示にすることもできます。
商品情報の構成
商品情報セクションは、お知らせバーの下に固定されており、順番を変更することはできません。
- 商品概要: 商品名の下に簡単な商品説明が表示されます。
- 評価:商品概要の下に表示されます。商品の評価を有効にするには、商品レビュー管理アプリをインストールしてください。(商品レビューに関する詳細はこの記事を参照してください。)
- スタイル選択:商品グループや名前に基づいて商品のバリエーションにリンクし、顧客が対応するリンクを使用して異なるカラーオプションを切り替えることができます。
商品説明の設定
商品説明コンポーネントを使用して、メタフィールドや商品タグを使用して商品情報を表示できます。タイトルの編集やスタイリングのカスタマイズも可能です。
カスタム詳細の設定
カスタム詳細コンポーネントを複数追加し、メタフィールドや商品タグを使用して表示する商品を選択できます。タイトル、コンテンツタイプ、アイコンもカスタマイズできます。
関連コレクションの設定
関連コレクションコンポーネントを使用して、メタフィールドを使用して商品コレクションを選択できます。タイトルも編集できます。(メタフィールドに関する詳細はこの記事を参照してください。)
カスタム画像の設定
カスタム画像コンポーネントを複数追加し、画像をアップロードし、表示先ページを設定し、特定の商品グループ用に画像を表示するための条件付きタグを使用できます。
最近見た商品の設定
最近見たコンポーネントを非表示または削除できます。タイトルや表示スタイルもカスタマイズできます。
商品レビューの設定
商品レビューコンポーネントを有効にするには、商品レビュー管理アプリをインストールしてください。アプリがインストールされていない場合、コンポーネントはグレーアウトされ、画面上にインストールのプロンプトが表示されます。(商品レビューに関する詳細はこの記事を参照してください。)
商品レコメンドの設定
商品レコメンド
コンポーネントを有効にするには、商品レコメンドアプリをインストールしてください。アプリがインストールされていない場合、コンポーネントはグレーアウトされ、画面上にインストールのプロンプトが表示されます。(商品レコメンドに関する詳細はこの記事を参照してください。)