テーマ管理 カスタマイズ トップ画面

カスタマイズ：トップ画面でできること

トップ画面のカスタマイズができます。

セクション

トップ画面の各セクションでは、以下項目をカスタマイズできます。

ヘッダー	Caution!! ヘッダーの設定は全画面共通の設定です。 ※パスワード保護画面を除く ロゴ画像 ロゴアライメント ヘッダーセクションのロゴの配置を設定します。 左 中央揃え ロゴ画像 画像をアップロードして設定します。 ※画像URLを用いた画像反映はテーマ管理 ファイルサイズの大きい画像の設定方法をご確認ください。 ロゴの幅 ロゴの幅を設定します。 告知バー 告知を表示する 告知バーの表示有無を設定します。 トップのみ表示 「告知を表示する」チェックを入れた際に、告知バーをトップのみに表示するかの有無を設定します。 テキスト 告知バーに表示するテキストを設定します。 バー 告知バーの背景色を設定します。 テキスト 告知バーのテキストの色を設定します。 バナー バナーを表示する バナーの表示有無を設定します。 トップのみ表示 「バナーを表示する」チェックを入れた際に、バナーをトップのみに表示するかの有無を設定します。 PC画像 バナーとして表示する画像を設定します。 PCのみに適用されます。 ※画像URLを用いた画像反映はテーマ管理 ファイルサイズの大きい画像の設定方法をご確認ください。 SP画像 バナーとして表示する画像を設定します。 SPのみに適用されます。 ※画像URLを用いた画像反映はテーマ管理 ファイルサイズの大きい画像の設定方法をご確認ください。 バナーのリンク先 バナーを押下した際の遷移先を設定します。
スライドショー	スライドショーの設定を行います。 スライドショーの画像は最大6枚まで設定可能です（下図は2枚設定しています）。 スライドの自動切換え チェックを入れるとスライドショーが自動で切り替わります。 切り替え間隔 スライドの自動切り替え間隔の設定を行います。 切り替え間隔は、3秒〜9秒で設定可能です。 画像 スライドショーに表示する画像を設定します。 ※画像URLを用いた画像反映はテーマ管理 ファイルサイズの大きい画像の設定方法をご確認ください。 見出し 見出しのテキストを設定します。 小見出し 小見出しのテキストを設定します。 ボタンラベル スライドショーに設定するボタンのラベルを設定します。 ボタンリンク ボタン選択したときのリンク先を設定します。
商品	商品 見出し 商品セクションの見出しを設定します。 小見出し 商品セクションの見出しを設定します。 表示形式 並べて表示 商品を並べて表示します。 カルーセル表示 商品をカルーセル表示で表示します。 表示対象 表示するカテゴリー 選択した商品カテゴリーに属する商品にのみ表示します。複数の商品カテゴリーを選択できます。 何も選択されていない状態では、ステータスが表示になっている全ての商品が表示されます。 新着のみ 「新着フラグ：有効」の商品にのみ表示します。 SALE中のみ 「セールフラグ：有効」の商品にのみ表示します。 表示件数 行あたりの商品表示件数 表示件数の設定を行います。 表示件数は、1件〜5件で設定可能です。 ※SPでは1スライド当たりの表示件数は2件までです。 表示行数 表示行数の設定を行います。 表示件数は、1件〜10件で設定可能です。 もっと見るボタン チェックボックスを外すと、もっと見るリンクボタンが表示されなくなります。
商品カテゴリー	カテゴリーのスタイル 商品カテゴリーのデザインが設定可能です。 「余白なし」「均等揃え」から選択できます。 表示件数 表示件数の設定を行います。 表示件数は、1件〜12件で設定可能です。 表示するカテゴリー 選択された商品カテゴリーを表示します。 選択されている商品カテゴリー数が表示件数に満たない場合、選択されている商品カテゴリーの数が優先されます。 何も選択されていない場合、全ての商品カテゴリーから表示件数分の商品カテゴリーが表示されます 商品カテゴリーは「設定 > 商品 > 商品カテゴリー管理」で設定可能です。
ニュース	見出し ニュースセクションの見出しを設定します。 小見出し ニュースセクションの小見出しを設定します。 表示するカテゴリー 表示するニュースカテゴリーを設定します（複数選択不可）。選択したカテゴリーに属するニュースのみを一覧で表示できます。 ニュースカテゴリーは「ショップ管理 > ニュースカテゴリー管理」で設定可能です。 デザイン ニュースのデザインを設定します。 リスト表示 グリッド表示 メディア風表示（初期値） 表示件数 表示件数の設定を行います。 表示件数は、1件〜5件で設定可能です。 もっと見るボタン 「もっと見る」ボタンの表示、非表示を設定します。
コンセプト	テキストの表示位置 コンセプトセクションのデザインの設定をします。 画像 コンセプトセクションの背景画像を設定します。 ※画像URLを用いた画像反映はテーマ管理 ファイルサイズの大きい画像の設定方法をご確認ください。 見出し コンセプトセクションの見出しを設定します。 本文 コンセプトセクションの本文を設定します。 背景 テキストの背景色を設定します。
サインアップ	画像 サインアップの背景に指定する画像を設定します。 ※画像URLを用いた画像反映はテーマ管理 ファイルサイズの大きい画像の設定方法をご確認ください。 見出し サインアップセクションの見出しを設定します。 小見出し サインアップセクションの小見出しを設定します。 本文 サインアップセクションの本文を設定します。
フッター	Caution!! フッターの設定は全画面共通の設定です。 ※パスワード保護画面を除く フッターメニュー フッターメニューの設定を行います。 フッターメニューは追加・削除が可能です。 カテゴリーの一覧を表示 フッター内の商品カテゴリーの「表示/非表示」の切り替えを行います。 ※「表示」に設定した場合「設定 > 商品 > 商品カテゴリー管理」画面で表示と設定されているカテゴリーがすべて表示されます。 テキスト フッターに表示するテキストを設定します。 フッターメニューを追加する 「＋」をクリックすると、フッターメニューが追加します。 フッターメニュー◯　 ◯内は数字が表示されます。 見出し フッターメニューの見出しを設定します。 リンクテキスト フッターメニュー配下のリンクテキストを設定します。 リンク先URL リンクテキスト選択時に遷移するリンク先を設定します。 ロゴ ロゴ画像 フッターセクションのロゴ画像を設定します。 画像をアップロードして設定します。 ※画像URLを用いた画像反映はテーマ管理 ファイルサイズの大きい画像の設定方法をご確認ください。 ロゴの幅 ロゴの幅を設定します。 SNSアカウント SNSのリンク先を設定します。入力することで、各SNSアイコンが表示されます。 対象のSNSは以下になります。 Facebook Twitter Instagram LINE 色 フッターの色を設定します。 背景 背景色を設定します。 見出し 見出しを設定します。 リンク リンクの色を設定します。 本文 本文の色を設定します。
区切り線	Caution!! 区切り線セクションは初期設定では表示されておりません。ご利用の場合は「セクションを追加する」から追加してください。
バナー	Caution!! バナーセクションは初期設定では表示されておりません。ご利用の場合は「セクションを追加する」から追加してください。 PC画像 バナーとして表示する画像を設定します。 PCのみに適用されます。 ※画像URLを用いた画像反映はテーマ管理 ファイルサイズの大きい画像の設定方法をご確認ください。 SP画像 バナーとして表示する画像を設定します。 SPのみに適用されます。 ※画像URLを用いた画像反映はテーマ管理 ファイルサイズの大きい画像の設定方法をご確認ください。 バナーのリンク先 バナーを押下した際の遷移先を設定します。
動画	Caution!! 動画セクションは初期設定では表示されておりません。ご利用の場合は「セクションを追加する」から追加してください。 ※動画セクションは1つのみ設置可能 YouTube 動画 ID 再生するYouTubeの動画の設定ができます。 ※動画 IDとはYouTubeのリンク内の v= 以降の半角英数字 (例) https://www.youtube.com/watch?v=GqTfuEiy7Kc を再生する場合は「GqTfuEiy7Kc」を入力します。 表示サイズ 再生する動画の表示サイズが設定できます。 「大」を選択した場合には「動画を見る」ボタンが表示されます。 見出し 動画セクションの見出しを設定します。 小見出し 動画セクションの小見出しを設定します。
画像スライダー	Caution!! 画像スライダーセクションは初期設定では表示されておりません。ご利用の場合は「セクションを追加する」から追加してください。   画像スライダーの画像は最大10枚まで設定可能です（下図は*枚設定しています）。 スライドの自動切換え チェックを入れると画像スライダーが自動で切り替わります。 切り替え間隔 スライドの自動切り替え間隔の設定を行います。 切り替え間隔は、3秒〜9秒で設定可能です。 画像 画像スライダーに表示する画像を設定します。 ※画像URLを用いた画像反映はテーマ管理 ファイルサイズの大きい画像の設定方法をご確認ください。 リンク 画像をクリックしたときのリンク先を設定します。
ランキング	Caution!! ランキングセクションは初期設定では表示されておりません。ご利用の場合は「セクションを追加する」から追加してください。 ランキング対象商品が存在しない場合はランキングセクションが非表示となります。 ※ランキング機能の詳細はこちらを参照してください。 ■ランキング対象商品が存在しないケース ・「ショップの機能設定 > ランキング表示対象外商品」にて全商品が除外設定されている ・商品管理にて商品のステータスが全て非表示である 見出し ランキングセクションの見出しを設定します。 小見出し ランキングセクションの見出しを設定します。 表示項目 商品詳細表示 商品の詳細の表示/非表示を設定します。 商品名表示 商品名の表示/非表示を設定します。 商品価格表示 商品価格の表示/非表示を設定します。 商品カテゴリー表示 商品カテゴリーの表示/非表示を設定します。 表示件数 ランキング表示件数 ランキング表示件数の設定を行います。 表示件数は、1件〜5件で設定可能です。

セクションを非表示にする

ショップに表示しないセクションを非表示に設定できます。
たとえば、新商品の販売を開始する準備ができるまでは、新商品セクションを一時的に非表示にできます。

1. 編集するテーマファイルの「カスタマイズ」をクリックします。
2. 「タブ：セクション」をクリックします。
3. 非表示にするセクションの目玉アイコンをクリックします。
   
4. 「保存する」をクリックします。

セクションを非表示にすると、目玉アイコンの表示が下図のようになります。

非表示にしたセクションを表示するには、目玉アイコンを再度クリックします。

セクションを並び替える

ショップに表示するセクションの並び替えを行えます。

1. 編集するテーマファイルの「カスタマイズ」をクリックします。
2. 「タブ：セクション」をクリックします。
3. 並び替えるセクションのドラックアンドドロップアイコンをクリックし、表示したい箇所へ移動します。
   
4. 「保存する」をクリックします。

セクションを追加する

ショップに表示するセクションを追加します。

1. 編集するテーマファイルの「カスタマイズ」をクリックします。
2. 「セクションを追加する」をクリックします。
   
3. 追加したいセクションをクリックし「選択する」をクリックします。
4. 「保存する」をクリックします。

セクションを削除する

ショップに表示するセクションを削除できます。

1. 編集するテーマファイルの「カスタマイズ」をクリックします。
2. 「タブ：セクション」をクリックします。
3. 「セクションを削除する」をクリックします。
   
4. 「保存する」をクリックします。

テーマ設定

テーマ設定では、ショップの色、文字体裁、SNSのリンク、ファビコン、動作を変更できます。

注意事項

テーマカスタマイズは、ecforceが提供するテーマテンプレート（ec_force_basic_theme）でのみ利用可能です。