パネルパーツ追加・変更
コマースクリエイター>パーツ>パネルパーツ
パーツ一覧よりパネルパーツで作成されたパーツの ボタン、もしくは[パーツを追加する]ボタンよりパネルパーツを選択すると遷移します。
スタートアップテーマでは、あらかじめヘッダー・フッター用パネルパーツを、すべてのレイアウトに配置済みです。
ページの種類に応じて配置されているパーツが異なります。
以下で確認してください。
スタートアップテーマのご利用方法-「headタグ」「ヘッダーエリア」「フッターエリア」
利用方法などの参考として、管理画面内にてご覧ください。
<スタートアップテーマでの利用例(一部)>
- headタグ共通(スマートフォン)
- ヘッダーコンテンツ
- サブエリア(メニュー等・PC)
- 告知バナーパネル
※配置されているパーツの一覧はスタートアップテーマのご利用方法をご覧ください。
複数のパーツをまとめてレイアウトに配置できるパーツを作成できます。
複数のレイアウト(ページ)に共通で配置する、ヘッダやフッタなどをパネルパーツで作成すると、パネルパーツ内に含まれる共通パーツを一回の操作するだけで、全パネルパーツの内容を変更でき、ECサイトを効率的に運用できます。
パネルパーツに追加(内包)できるパーツは、フリーパーツ/パネルパーツ/パターンパーツ(カルーセル・コラム・箇条書き・任意商品表示・メニュー)です。
パーツについての解説と利用方法については、パーツ一覧-パーツとはをご覧ください。
<目次>
オプションを設定する
画面上部の[オプションを設定する]を押下すると、HTMLタグや管理タグ、備考を設定するダイアログが開きます。
[オプションを設定する]ボタン
オプション設定ダイアログ
備考の表示場所
HTML要素
HTMLタグは、パーツを囲むwrapタグを設定できます。
div・section・nav・article・aside・header・footer・dialogタグのいずれか、または「指定なし」から選択してください。
id/classを指定する場合は、「指定なし」以外のいずれか選択してください。
id
HTML要素のid属性の値を設定できます。 半角英数・記号(-_):100字
class
HTML要素のclass属性の値を設定できます。 半角英数字・半角スペース・記号("以外):100字
管理タグ
管理タグ追加・変更-管理タグ活用のポイントをご覧ください。
備考
パーツの用途や表示画面などを入力すると管理がしやすくなります。 文字数:400字
パーツ名
パーツの名称を設定できます。 文字数:100字
置換文字
パーツ置換文字を入力します。
どのパーツの置換文字であるか、分かりやすい任意の文字列を入力してください。 半角英数・記号(._-):100字
パーツ置換文字は複製・追加時に設定できます。一度設定すると変更はできません。
置換文字の活用方法
フリーパーツに、置換文字を記述すると読み込まれます。
変更や修正を加える際、該当のフリーパーツを一つ作業するだけで置換文字を記述した他のすべてのパーツに反映されるので、運用のミス防止や効率化につながります。
フリーパーツ-パーツ置換文字の活用方法もご参照ください。
パーツ一覧
パーツ検索
レイアウトに配置するパーツを検索できます。検索条件を表示するボタンを押下すると「管理タグ」「種類」で検索できます。
パーツ名
パーツをパーツ名で検索できます。パーツ名を部分一致で検索できます。 文字数:100字
管理タグ
パーツを管理タグで検索できます。管理タグ欄を選択すると、候補が表示されます。
インクリメンタルサーチ機能があり、文字を入力するたびに前方一致で候補が絞込まれます。
種類
パーツを種類で検索できます。
フリーパーツ/カルーセル/コラム/メニュー/箇条書き/任意商品表示/パネルパーツから検索できます。
検索するボタン
指定した条件でパーツを検索できます。
パーツ検索結果一覧
検索条件に合致したパーツが表示されます。
パーツは100件まで表示されます。
パーツ名
パーツの名称が表示されます。選択すると並び替えできます。
更新日時
選択するとパーツの更新日時で並び替えできます。パーツの更新日時自体は表示されません。
パーツ配置エリアへ移動
配置するボタンを押下すると、パーツ配置エリアの下部に追加されます。
パーツ配置エリア
パネルパーツ変更画面左側のパーツ配置エリアに表示されているパーツがパネルパーツとしてまとめて表示されます。
パーツが配置されていない状態
パーツ一覧からパーツをドラッグして配置
表示順を変更する
パーツの表示順を変更するボタン を選択してドラッグするとパーツを上下に移動でき、パーツの表示順を変更できます。
パーツを表示/非表示にする
非表示にする
パーツ操作ボタンからポップアップメニューを表示し、「 表示しない」を選択します。
「表示しない」を選択すると、パーツはパネルに配置されていますが、ECサイトに表示されなくなります。
「表示しない」に設定されたパーツはHTMLタグ自体が出力されなくなります。
表示する
パーツ操作ボタンからポップアップメニューを表示し、「 表示する」を選択します。
パーツがECサイトには表示されます。(HTMLも出力されます。)
パーツを外す
パネルパーツ変更画面では、パーツ配置エリアに配置されているパーツを外せます。
パーツを非表示にすることもできますが、使用しない場合などはパーツを外してください。
パーツ配置エリアに配置されているパーツの操作するボタン を押下してください。
選択肢にある「 パーツを外す」を選択すると、パーツがパーツ配置エリアから消去されます。
パーツを外すとパネルパーツの内容から消去されますが、パーツ自体は削除されません。
再度、パーツ配置エリアに配置するには、パーツ検索してパーツ一覧に表示させた後、パーツ配置エリアにドラッグ&ドロップしてください。
パーツを追加する
画面右側の「パーツ一覧」で追加したいパーツを検索し、パーツ一覧に表示されたパーツの追加するボタン を押下すると、パーツ配置エリアの最下部に追加されます。
パーツ一覧に表示されたパーツの を選択し、パーツ配置エリアへドラック&ドロップしても追加できます。
パネルパーツに追加できるパーツは、フリーパーツ/パターンパーツ(カルーセル・コラム・箇条書き・任意商品表示・メニュー)/パネルパーツです。
パーツを変更する
パネルパーツ変更画面では、パーツ配置エリアに配置されているパーツの変更画面へ直接遷移できます。
パネルパーツでは、配置されているパーツの「パーツ名」が表示されていますので、パネルパーツに配置されているパーツを確認した上で、対象のパーツを変更していくという作業がしやすくなります。
修正したいパーツの操作するボタン を押下してください。
選択肢にある「 パーツを変更する」を押下してください。
該当パーツの変更画面へ遷移できます。
なお、遷移元のパネルパーツで保存していない作業内容がある場合、破棄されます。
変更画面に遷移する前に保存するボタンを押下して下さい。
保存する
パーツを保存します。
キャンセルする
未保存の作業内容を破棄します。
パネルパーツを削除する
削除するボタンを押下すると、パネルパーツを削除できます。
パネルパーツを追加する(新規作成)場合には表示されません。
戻る
レイアウト変更から直接パーツを変更する場合にのみ表示されます。
押下すると、レイアウト変更に戻ります。
未保存の作業内容は破棄されます。
保存するボタンを押下した後、[戻る]ボタンを押下してください。
レイアウト変更から直接パーツを変更する方法については、パーツ配置エリア上からパーツを変更するをご覧ください。