「ログイン」画面
※表示イメージはスタートアップテーマ(カスタマイズ前)です。
利用するパーツや項目設定により表示内容やレイアウトを変更することができます。詳しくは各システムパーツの説明をご覧ください。
ログイン画面には、「ショッピングカートログイン」「マイページログイン」「お気に入りログイン」「レビューログイン」があります。
「ショッピングカートログイン」は、「通常カート」「定期・頒布会カート」それぞれの遷移先として「ショッピングカートログイン」「ショッピングカートログイン(定期)」の2種類があります。
ログインページレイアウトに配置されるシステムパーツは以下となります。画像は「スタートアップテーマ」のものとなります。
パーツごとの表示イメージと解説
ログイン情報表示エリア(システムパーツグループ)
ログインフォームやボタンを表示するシステムパーツを配置する特殊なシステムパーツ(システムパーツグループ)です。
futureshop会員エリア(システムパーツグループ)
会員ログインフォームを表示するシステムパーツを配置する特殊なシステムパーツ(システムパーツグループ)です。
ログインパーツ
他社サービスログインエリア(システムパーツグループ)
他社IDによるログインボタンを表示するシステムパーツを配置する特殊なシステムパーツ(システムパーツグループ)です。
以下の各ログイン画面ごとにシステムパーツグループが用意されています。
- 他社サービスログインエリア(カート)(システムパーツグループ)
- 他社サービスログインエリア(定期カート)(システムパーツグループ)
- 他社サービスログインエリア(お気に入り)(システムパーツグループ)
- 他社サービスログインエリア(LINE)(システムパーツグループ)
- 他社サービスログインエリア(レビュー)(システムパーツグループ)
連携ログインパーツ
「ログイン連携」機能については、それぞれAmazon・Apple・Google・LINEをご覧ください。
各サービスのボタンの並び順は変更可能です。詳しくは、[参考]「Apple」「Google」「Amazon」「LINE」ボタンの並び替え方法をご覧ください。
- 「連携サービスでログイン・会員登録」(見出し)
- コマースクリエイター>メッセージの「連携ログイン見出し」で変更できます。
- 「連携ログインメッセージ」(メッセージ)
- コマースクリエイター>メッセージの「連携ログインメッセージ」で変更できます。
- 初期値は設定されていません。左図では、例文として「[連携ログインメッセージ]以下のIDやアカウントでもログイン・会員登録できます。」と表示しています。
- [Appleでサインイン]ボタン
- コマースクリエイター>テーマ設定-Apple設定でボタンのカラーを選択できます。
- コマースクリエイター>メッセージの「Appleでサインインメッセージ」で、ボタンの上に説明文を表示できます。
- 初期値は設定されていません。左図では、例文として「Apple IDでログインし、ログイン・会員登録していただけます。」と表示しています。
- [Googleでログイン]ボタン
- コマースクリエイター>テーマ設定-Google設定でボタンのカラーを選択できます。
- コマースクリエイター>メッセージの「Googleでログインメッセージ」で、ボタンの上に説明文を表示できます。
- 初期値は設定されていません。表示位置は[Appleでサインイン]をご参照ください。
- [amazonでログイン]ボタン
- コマースクリエイター>テーマ設定-Amazon設定でボタンのカラーを選択できます。
- コマースクリエイター>メッセージの「Amazonログインメッセージ」で、ボタンの上に説明文を表示できます。
- 初期値は設定されていません。左図では、例文として「Amazon.co.jpにご登録の情報を利用してログインまたは会員登録されるお客様は、「Amazonアカウントでログイン」ボタンよりお進みください。」と表示しています。表示位置は[Appleでサインイン]をご参照ください。(※2022.10.19以前からご利用の店舗様は例文が初期値として表示されています。)
Apple IDで「ログイン連携」を利用するには、各種お申し込みや設定が必要です。
「Apple
ID」「Googleアカウント」とのログイン連携のはじめかたをご覧ください。
Googleアカウントで「ログイン連携」を利用するには、各種お申し込みや設定が必要です。
「Apple
ID」「Googleアカウント」とのログイン連携のはじめかたをご覧ください。
事前に、他社ID決済オプション Amazon
Payのお申し込み、および、別途アマゾンジャパン合同会社とのご契約が必要です。
Amazonログイン連携のはじめかたと画面遷移をご覧ください。
LINEログインパーツ
スマートフォンでの表示の場合のみ表示されます。
- [LINEでログイン]ボタン
- ボタンカラーなどは変更できません。
- 「LINEとの会員連携がお済みの方は、「LINEでログイン」ボタンからログインしてください。まだの方は、LINEと会員連携をしてください。」(メッセージ)
- コマースクリエイター>メッセージの「LINEログインメッセージ」で変更できます。
事前に、LINE連携オプションのお申し込みが必要です。
LINEとのID連携の設定手順をご覧ください。
各サービスのボタンの並び順は変更可能です。
詳しくは、[参考]「Apple」「Google」「Amazon」「LINE」ボタンの並び替え方法をご覧ください。
ログインせずに購入表示
「ショッピングカートログイン(通常カート)」にのみ表示されます。
その他のログイン画面や、「定期・頒布会カート(会員登録必須)」から遷移した場合には、表示されません。
futureshop非会員エリア(システムパーツグループ)
会員登録ボタンなどを表示するシステムパーツを配置する特殊なシステムパーツ(システムパーツグループ)です。
以下の各ログイン画面ごとにシステムパーツグループが用意されています。
- futureshop非会員エリア(お気に入り)(システムパーツグループ)
- futureshop非会員エリア(LINE)(システムパーツグループ)
- futureshop非会員エリア(レビュー)(システムパーツグループ)
会員登録誘導表示
戻るボタン
他社サービスログイン後表示
「ログイン連携」機能については、それぞれAmazon・Apple・Google・LINEをご覧ください。
連携ログイン後表示
Amazonアカウントでログイン済みの場合
Amazonアカウントでログインした際、既に別の会員IDと連携済みである場合、未連携であるが同一アドレスの会員IDがある場合に表示されます。
- 「Amazonから取得したメールアドレスで、既に会員登録があります。他の方法でログインしていただき、マイページからログイン連携へお進みください。」(メッセージ)
- コマースクリエイター>メッセージの「 Amazonログイン後メッセージ」で変更できます。
Apple IDでログイン済みの場合
Apple IDでログインした際、既に別の会員IDと連携済みである場合、未連携であるが同一アドレスの会員IDがある場合に表示されます。
- 「Appleから取得したメールアドレスで、既に会員登録があります。他の方法でログインしていただき、マイページからログイン連携へお進みください。」(メッセージ)
- コマースクリエイター>メッセージの「Appleログイン後メッセージ」で変更できます。
Googleアカウントでログイン済みの場合
Googleアカウントでログインした際、既に別の会員IDと連携済みである場合、未連携であるが同一アドレスの会員IDがある場合に表示されます。
- 「Googleから取得したメールアドレスで、既に会員登録があります。他の方法でログインしていただき、マイページからログイン連携へお進みください。」(メッセージ)
- コマースクリエイター>メッセージの「Googleログイン後メッセージ」で変更できます。
メッセージが表示される画面遷移や条件については、画面遷移について-会員登録済(未ログイン状態含む)のお客様(消費者)の場合をご覧ください。
LINEログイン後表示
LINE IDと同じメールアドレスで会員登録があるが、会員情報とID連携していない場合に表示されます。
- 「会員にご登録済みの場合は、ログインしてください。
会員登録がまだの方は、このまま会員登録していただけます。」(メッセージ) - コマースクリエイター>メッセージの「LINEログイン後メッセージ」で変更できます。
お気に入りログイン説明(フリーパーツ)
お気に入りログインでのみ使用します。
ゲストパーツ
レビューログインでのみ使用します。
コマースクリエイター>メッセージにある「レビューログインゲスト投稿メッセージ」を表示できます。
設定>レビュー>レビュー基本設定-レビュー機能設定運用>レビュー管理>レビュー基本設定-書き込み制限にて 「全員が投稿可能」「誰でも書き込み可能」を選択している場合、ゲスト(非ログイン状態)のお客様(消費者)が「商品詳細」画面・マイページ内「注文履歴詳細」画面などの[レビューを書く]を押下すると表示されます。
[参考]「Apple」「Google」「Amazon」「LINE」ボタンの並び替え方法
「Apple」・「Google」・「Amazon」・「LINE」の連携オプションを利用している場合、各ログイン連携用のボタンは、初期値では「Apple」「Google」「Amazon」「LINE」の並びで表示されます。
「Apple」「Google」「Amazon」のボタンの表示順を変更するには、CSSを利用します。
「LINE」は別のシステムパーツで出力されていますので、一番上か一番下にのみ変更できます。
変更する場合は「システムパーツ」を移動させます。
いくつか並び順の変更例を記載しますので、参考にしてください。
なお、CSSは、オリジナルCSSやアイテムにて追加してください。
「Apple」「Google」の順序を変更する方法
.fs-c-anotherLogin--google { order: -1; }
「Apple」「Google」「Amazon」の並び順を変更する方法
1.並び順をすべて指定する方法
.fs-c-loginForm .fs-c-anotherLogin--amazon { order: 1; } .fs-c-loginForm .fs-c-anotherLogin--google { order: 2; } .fs-c-loginForm .fs-c-anotherLogin--apple { order: 3; }
2.初期表示として出力される順序を逆にする方法
初期表示:「Apple」「Google」「Amazon」
変更後:「Amazon」「Google」「Apple」
.fs-c-linkedServiceLogin__login { flex-direction: column-reverse; }
「LINE」を一番上に表示する方法
「LINE」のボタンが含まれる「LINEログインパーツ(システムパーツ)」と「Apple」「Google」「Amazon」のボタンが含まれる「連携ログインパーツ(システムパーツ)」の順序を入れ替えます。
関連情報
ログイン状態の保持期間
自動ログインは180日間有効
一度会員ログインを行うと、180日間はログアウトされるまでログイン状態が続きます。
お気に入りリストに入れた商品を確認する際など、スムーズにアクセスできます。
一方、「会員情報変更」画面など、個人情報にアクセスする際は認証が求められます(ログイン画面が表示されます)。
なお自動ログイン状態となるのは、ログインから30分後です。
「ログイン連携」機能について
「ログイン連携」機能のご利用方法や画面遷移などについて、詳しくは「Apple ID」「Googleアカウント」とのログイン連携のはじめかたをご覧ください。