[概要]各画面に共通して使用されるシステムパーツ
各レイアウト(各ユーザー画面)に共通して使用されるシステムパーツについてご説明します。
<表示イメージと解説>
各レイアウトに共通して使用されるシステムパーツ
画像は「スタートアップテーマ」のものとなります。一部、システムパーツ以外もご紹介しています。
<div class="fs-l-page"></div>
<div class="fs-l-page"></div> というHTMLタグで、<body>
タグの内側に必ず配置されているタグです。
全レイアウト共通で、レイアウト変更には表示されません。<body>
タグ内に配置されるすべてのパーツ、つまりページに表示する内容は、すべてこのタグの内側に配置されます。
ただし、システムで使用するJavaScriptや設定>プロモーション>測定タグ一覧/【コマースクリエイター移行中(切替前)】測定タグ一覧(コマースクリエイター)で出力される内容は、<div class="fs-l-page"></div>と同じ階層に出力されます。
最上位階層の名称・リンク先など設定>商品・商品グループ>商品ページ設定-パンくずリスト設定構築>ページ設定>商品ページ設定-パンくずリスト設定にて設定できます。
メインエリア(レイアウトパーツ)
スタートアップテーマ・スケルトンテーマともに、全レイアウトに配置されているレイアウトパーツです。
下部階層にページのコンテンツが配置されるコンテンツエリア(レイアウトパーツ)が配置されています。
<main class="fs-l-main"></main> というHTMLタグが設定されています。(レイアウトによってclassが追加されます。)
エラー表示
各ページで起こるエラーを表示するパーツです。
コンテンツエリア(レイアウトパーツ)
スタートアップテーマの「商品詳細」レイアウトや、「商品グループ」レイアウトなどに配置されているレイアウトパーツです。
<section class="fs-l-pageMain"></section> というHTMLタグが設定されています。
ページ見出し(フリーパーツ)
スタートアップテーマに配置されているフリーパーツで、ページ見出しを表示します。
内容はページ名の置換文字{% page.heading %}が記述されています。
ページ名はコマースクリエイター>ページ設定-ページ見出しにて変更できます。
マイページトップボタン
注文履歴・クーポン情報などのマイページにある各ページからマイページトップへ戻るボタンです。
ラベルはコマースクリエイター>テーマ>ボタン一覧にある「マイページトップ-マイページ」にて変更できます。
「会員登録」「メールマガジン申し込み」時に「認証コード」によるメールアドレス認証を行う場合に表示されます。
メールアドレス認証機能を利用するには、それぞれ以下にチェックします。
- 設定>購入者・会員情報>会員設定-利用設定「会員登録メールアドレス認証設定」
- 設定>メールマガジン>メールマガジン基本設定-メールマガジン設定「申し込みメールアドレス認証設定」
表示場所
遷移先
それぞれ以下に遷移します。
ラベルなどの変更
コマースクリエイター>テーマ>ボタン一覧にある「戻る-会員・メールマガジン」にて変更できます。
パンくず(BreadcrumbList)を表す構造化データを出力します。JavaScript形式(JSON-LD形式)で画面には表示されません。