キャンセル
検索
導入前のご相談 06-6485-5330
運用サポート:06-6485-6485 平日9:30~18:00(土日祝除く)
コマースクリエイター無効コマースクリエイター有効コマースクリエイター運用中?

商品一覧・商品詳細のレイアウト

×

マニュアル閲覧上の注意

店舗の状態にあわせて、上のボタンからいずれかを選択してください。表示される項目が変更されます。

コマースクリエイター無効
以前からの管理画面で構築し、以前からのECサイト(ユーザー画面)で店舗を構築・運用されている場合(コマースクリエイターをご利用でない場合)はこちらを選択してください。
コマースクリエイター有効
以前からの管理画面で構築し、以前からのECサイト(ユーザー画面)で店舗を構築・運用しながら、コマースクリエイター管理画面が使用できる場合はこちらを選択してください。
コマースクリエイター運用中(切替後)
コマースクリエイター管理画面で構築し、コマースクリエイター専用ECサイト(ユーザー画面)で店舗を構築・運用されている場合(以前からのユーザー画面をご利用でない場合)はこちらを選択してください。

上記のボタンは再選択できます。店舗の状態がわからない方はコマースクリエイターご利用状況の確認方法についてをご覧ください。

バリエーション表示の切り替え

商品一覧のバリエーション表示変更

商品一覧のバリエーション表示は、以下の2種類のいずれかになります。 バリエーション表示用のシステムパーツの中から選んで商品詳細レイアウトに配置してください。

  • カート・バリエーションごとにカートボタンパーツ
  • カート・セレクトボックスのみパーツ

商品グループごとに商品一覧レイアウトを指定できますので、商品グループごとにバリエーション表示方法を変更できます。 商品グループレイアウトを複製し、任意のバリエーション表示パーツを配置してください。

商品グループごとにレイアウトを変更するには、レイアウト変更-割当名(商品詳細・商品グループ・フリーページ用レイアウト)をご覧ください。
バリエーション表示ごとの設定変更は構築メニュー>ページ設定>商品ページ設定-バリエーション表示設定 (コマースクリエイター)で行えます。

商品詳細のバリエーション表示変更

商品詳細のバリエーション表示は、以下の4種類のいずれかになります。
バリエーション表示用のシステムパーツの中から選んで商品詳細レイアウトにいずれか1つを必ず配置してください

  • カート・バリエーションごとにカートボタンパーツ
  • カート・バリエーション表組パーツ
  • カート・セレクトボックス&ラジオパーツ
  • カート・セレクトボックスのみパーツ

商品ごとに商品詳細レイアウトを指定できますので、商品ごとにバリエーション表示方法を変更できます。 商品詳細レイアウトを複製し、任意のバリエーション表示パーツを配置してください。

商品ごとにレイアウトを変更するには、レイアウト変更-割当名(商品詳細・商品グループ・フリーページ用レイアウト)をご覧ください。
バリエーション表示ごとの設定変更は構築メニュー>ページ設定>商品ページ設定-バリエーション表示設定 (コマースクリエイター)で行えます。

(バリエーション表示システムパーツ選択例)
商材 システムパーツ 説明
カート・バリエーションごとにカートボタンパーツカラー・サイズ別で表示できるため
シューズカート・バリエーション表組パーツカラー・サイズ別で、かつサイズ数が多い商材に適するため
雑貨カート・セレクトボックスのみパーツカラーのみ選択するため

商品詳細レイアウトのパターン

スタートアップテーマの商品詳細レイアウト

スタートアップテーマでは商品詳細のレイアウトとして下記4パターンをご用意しています。それぞれレイアウトパーツとスタートアップテーマのCSSにてデザインしております。

(バリエーション表示システムパーツ選択例)
レイアウト パーツ配置
横2列レイアウト画面幅に応じて、横に2列配置されるオーソドックスなレイアウトです。
横1列レイアウトすべてのシステムパーツを縦一列に並べる、横に段組みしていないレイアウトです。
上横1列・下横2列レイアウト上段が横1列、下段が画面幅に応じて横に2列に配置できるレイアウトです。
上横2列・下横1列レイアウト上段が画面幅に応じて横に2列、下段が横1列に配置できるレイアウトです。

「横2列」とあるレイアウトは、対応するブラウザ幅の場合(PC・タブレット想定)に段組みがされます。ブラウザ幅が狭い場合は、横1列となります。(レスポンシブ対応)
詳しくはスタートアップテーマリファレンス-[メディアクエリ(レスポンシブデザイン)]をご覧ください。

スタートアップテーマ 商品詳細レイアウトの使用法

レイアウトパーツごとにシステムパーツが初期配置されています。 システムパーツの配置を変更したい場合は、レイアウト変更でレイアウトパーツの開くボタンを押下して、配置を変更したいシステムパーツを操作してください。 システムパーツを別のレイアウトパーツに移動したい場合は、以下の手順となります。

  • レイアウトパーツ内に配置されているシステムパーツの操作するボタンから、「パーツをレイアウトから外す」を選択し、いったんシステムパーツをレイアウトから外す。
  • システムパーツを配置したいレイアウトパーツ(配置先)の開くボタンを押下
  • レイアウト変更画面のパーツ一覧にシステムパーツを表示する。表示されていない場合は、パーツ検索の検索条件でシステムパーツを選択し検索する。
  • 配置先のレイアウトパーツ内パーツ配置エリアに、システムパーツをドラッグ&ドロップする

項目表示について

各項目は以前からのECサイト用・コマースクリエイター用・共通の3種類があります。コマースクリエイター有効(切替前)は両方の項目が表示されます。

以前からのECサイト用項目で、コマースクリエイターでは使用しません。(右側にこちらの色の点線が表示されます。)

コマースクリエイター専用ECサイト用の項目です。以前からのECサイトには影響しません。(右側にこちらの色の点線が表示されます。)

上記以外は共通で使用する項目です。(何も表示されません。)

×

店舗の状態にあわせて、下のボタンからいずれかを選択してください。

コマースクリエイター無効 コマースクリエイター有効 コマースクリエイター運用中
コマースクリエイター無効
以前からの管理画面で構築し、以前からのECサイト(ユーザー画面)で店舗を構築・運用されている場合(コマースクリエイターをご利用でない場合)はこちらを選択してください。
コマースクリエイター有効
以前からの管理画面で構築し、以前からのECサイト(ユーザー画面)で店舗を構築・運用しながら、コマースクリエイター管理画面が使用できる場合はこちらを選択してください。
コマースクリエイター運用中(切替後)
コマースクリエイター管理画面で構築し、コマースクリエイター専用ECサイト(ユーザー画面)で店舗を構築・運用されている場合(以前からのユーザー画面をご利用でない場合)はこちらを選択してください。

再度選択できますので、店舗の状態がわからない方はいったん「有効」をお選びください。
詳しくはコマースクリエイターご利用状況の確認方法についてをご覧ください。