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

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

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

セクション

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

ヘッダー	Caution!! ヘッダーの設定は全画面共通の設定です。 ※パスワード保護画面を除く ロゴ画像 ロゴアライメント ヘッダーセクションのロゴの配置を設定します。 左 中央揃え ロゴ画像 画像をアップロードして設定します。 ※画像URLを用いた画像反映はテーマ管理 ファイルサイズの大きい画像の設定方法をご確認ください。 ロゴの幅 ロゴの幅を設定します。 ロゴのリンク先 ロゴのリンク先を設定します。設定無しの場合はトップページに遷移します。 告知バー 告知を表示する 告知バーの表示有無を設定します。 トップのみ表示 「告知を表示する」チェックを入れた際に、告知バーをトップのみに表示するかの有無を設定します。 テキスト 告知バーに表示するテキストを設定します。 ※HTML使用可能です。 バー 告知バーの背景色を設定します。 テキスト 告知バーのテキストの色を設定します。 バナー バナーを表示する バナーの表示有無を設定します。 トップのみ表示 「バナーを表示する」チェックを入れた際に、バナーをトップのみに表示するかの有無を設定します。 PC画像 バナーとして表示する画像を設定します。 PCのみに適用されます。 ※画像URLを用いた画像反映はテーマ管理 ファイルサイズの大きい画像の設定方法をご確認ください。 SP画像 バナーとして表示する画像を設定します。 SPのみに適用されます。 ※画像URLを用いた画像反映はテーマ管理 ファイルサイズの大きい画像の設定方法をご確認ください。 バナーのリンク先 バナーを押下した際の遷移先を設定します。 検索窓 検索窓を表示する 検索窓の表示有無を設定します。 表示位置はロゴアライメントに追従します。 ログイン状況 会員の名前を表示する 顧客がログインしている場合、アイコン画像の左隣に会員の名前が表示されます。 ※SP表示の場合はアイコン画像のみが表示されます。 アイコン横のテキスト（任意） ログインボタンの左横に任意のテキストを設定できます。 ログインボタンはテーマ設定 > ログインメニューより表示可能です。 ※HTML使用可能です。 アイコン画像(任意) アイコン画像を設定します。 画像をアップロードして設定します。 ※画像URLを用いた画像反映はテーマ管理 ファイルサイズの大きい画像の設定方法をご確認ください。
スライドショー	スライドショーの設定を行います。 スライドショーの画像は最大6枚まで設定可能です（下図は2枚設定しています）。 スライドの表示順 セレクトボックスで数字を選択するとスライドの表示順を変更できます。 SP用のコンテンツを設定する PC表示とは別にスマートフォン表示時のスライドを設定できます。 スライドの自動切り換え チェックを入れるとスライドショーが自動で切り替わります。 切替え間隔 スライドの自動切り替え間隔の設定を行います。 切り替え間隔は、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!! バナーセクションは初期設定では表示されておりません。ご利用の場合は「セクションを追加する」から追加してください。   バナーを追加する バナーを追加する 複数のバナーを追加することができます。 ※最大20個まで追加可能 レイアウト セクション見出し バナーセクションに見出しを設定することができます。 PCの表示件数(1行あたり) PC時の1行あたりのバナー表示件数を設定することができます。 ※設定可能範囲は1~4件 ※表示件数によって画像の推奨サイズがございます。 SPの表示件数(1行あたり) SP時の1行あたりのバナー表示件数を設定することができます。 ※設定可能範囲は1~2件 ※表示件数によって画像の推奨サイズがございます。 バナー内の設定値について PC画像 バナーとして表示する画像を設定します。 PCのみに適用されます。 ※画像URLを用いた画像反映はテーマ管理 ファイルサイズの大きい画像の設定方法をご確認ください。 SP画像 バナーとして表示する画像を設定します。 SPのみに適用されます。 ※画像URLを用いた画像反映はテーマ管理 ファイルサイズの大きい画像の設定方法をご確認ください。 バナーのリンク先 バナーを押下した際の遷移先を設定します。
動画	Caution!! 動画セクションは初期設定では表示されておりません。ご利用の場合は「セクションを追加する」から追加してください。 ※動画セクションは1つのみ設置可能 YouTube 動画 ID 再生するYouTubeの動画の設定ができます。 ※動画 IDとはYouTubeのリンク内の v= 以降の半角英数字 (例) https://www.youtube.com/watch?v=GqTfuEiy7Kc を再生する場合は「GqTfuEiy7Kc」を入力します。 表示サイズ 再生する動画の表示サイズが設定できます。 「大」を選択した場合には「動画を見る」ボタンが表示されます。 見出し 動画セクションの見出しを設定します。 小見出し 動画セクションの小見出しを設定します。 アップロード動画 再生する動画をPCなどから直接アップロードして設定できます。 ※「YouTube 動画 ID」を設定していてもこちらの設定が優先されます。 ※アップロードできるファイルサイズは99MB以下で、ファイルタイプはMP4,M4V,MOVがアップロード可能です。 本機能はオプション機能（動画ファイルアップロード）となります。 本機能をご利用いただく際は、以下オプション申し込みフォームからお申し込みください。 >> オプション申し込み
画像スライダー	Caution!! 画像スライダーセクションは初期設定では表示されておりません。ご利用の場合は「セクションを追加する」から追加してください。 画像スライダーの画像は最大10枚まで設定可能です（下図は*枚設定しています）。 スライドの自動切換え チェックを入れると画像スライダーが自動で切り替わります。 切り替え間隔 スライドの自動切り替え間隔の設定を行います。 切り替え間隔は、3秒〜9秒で設定可能です。 画像 画像スライダーに表示する画像を設定します。 ※画像URLを用いた画像反映はテーマ管理 ファイルサイズの大きい画像の設定方法をご確認ください。 リンク 画像をクリックしたときのリンク先を設定します。
ランキング	ランキング対象商品が存在しない場合はランキングセクションが非表示となります。 ※ランキング機能の詳細はこちらを参照してください。 ■ランキング対象商品が存在しないケース ・「ショップの機能設定 > ランキング表示対象外商品」にて全商品が除外設定されている ・商品管理にて商品のステータスが全て非表示である 見出し ランキングセクションの見出しを設定します。 小見出し ランキングセクションの見出しを設定します。 表示項目 商品詳細表示 商品の詳細の表示/非表示を設定します。 商品名表示 商品名の表示/非表示を設定します。 商品価格表示 商品価格の表示/非表示を設定します。 商品カテゴリー表示 商品カテゴリーの表示/非表示を設定します。 表示件数 ランキング表示件数 ランキング表示件数の設定を行います。 表示件数は、1件〜5件で設定可能です。 表示形式 本機能は2024年09月中のリリースより順次ご利用できるようになります。 ※具体的なリリース日はショップ様により異なります。確定した段階で管理画面トップページのバナーに掲載されるため、そちらをお待ちください。 全て 全ての商品情報を表示します。 カテゴリ別 商品情報をカテゴリーごとに表示します。
閲覧履歴	Caution!! 閲覧履歴セクションは初期設定では表示されておりません。ご利用の場合は「セクションを追加する」から追加してください。 閲覧履歴の設定を行います。 ※実際のショップ画面上では閲覧履歴はログインユーザーにのみ表示されます。テーマカスタマイズ画面上では公開期間中かつ販売中かつ表示中の商品が表示されます。 見出し 閲覧履歴セクションの見出しを設定します。 小見出し 閲覧履歴セクションの見出しを設定します。 表示形式 並べて表示 閲覧商品を並べて表示します。 カルーセル表示 閲覧商品をカルーセル表示で表示します。 表示項目 商品詳細表示 商品の詳細を表示します。 商品名表示 商品名を表示します。 商品価格表示 商品の価格を表示します。 商品カテゴリー名表示 商品カテゴリー名を表示します。 商品ラベル表示 商品ラベルを表示します。 表示件数 行あたりの商品表示件数 表示件数の設定を行います。 表示件数は、1件〜5件で設定可能です。 ※SPでは1スライド当たりの表示件数は2件までです。 表示行数 表示行数の設定を行います。 表示行数は、1〜2行で設定可能です。
カスタムHTML	Caution!! カスタムHTMLセクションは初期設定では表示されておりません。ご利用の場合は「セクションを追加する」から追加してください。 カスタムHTMLの設定を行います。 任意のHTMLを追加することができ、SNSの埋め込みコード等も記述することができます。 最大文字数は10,000文字です。
セレクション	Caution!! セレクションセクションは初期設定では表示されておりません。ご利用の場合は「セクションを追加する」から追加してください。 公開状態のセレクションページが存在しない場合はセレクションセクションが非表示となります。 ※セレクション機能の詳細はこちらを参照してください。 ■公開状態のセレクションページが存在しないケース ・セレクション管理にてセレクションページが全て公開期間外である ・セレクション管理にてセレクションページのステータスが全て非表示またはセレクション詳細のみ表示である 見出し セレクションセクションの見出しを設定します。 小見出し セレクションセクションの小見出しを設定します。 タイトルを表示する 各セレクションページのタイトルを表示します。 特集ページ一覧への導線を表示 「もっと見る」ボタンの表示/非表示を設定します。 行当たりのアイキャッチ表示件数 セレクションページのアイキャッチ画像を行当たりで何件表示するか設定します。 表示件数は、1~2件で設定可能です。 表示行数 セレクションページの表示行数の設定を行います。 表示行数は、1件〜5件で設定可能です。
レコメンド	本機能は2024年09月中のリリースより順次ご利用できるようになります。 ※具体的なリリース日はショップ様により異なります。確定した段階で管理画面トップページのバナーに掲載されるため、そちらをお待ちください。 Caution!! レコメンドセクションは初期設定では表示されておりません。ご利用の場合は「セクションを追加する」から追加してください。 レコメンド対象商品が存在しない場合、またはログインしている顧客が商品を購入していない場合、レコメンドセクションは非表示となります。 見出し レコメンドセクションの見出しを設定します。 小見出し レコメンドセクションの小見出しを設定します。 表示形式 レコメンドセクションの表示形式を設定します。 表示項目 レコメンドセクションの表示項目を設定します。 行当たりの商品表示件数 レコメンドセクションの行当たりの商品表示件数を設定します。 表示件数は、1~2件で設定可能です。 表示行数 レコメンドセクションの表示行数の設定を行います。 表示行数は、1〜5件で設定可能です。

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

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

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

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

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

セクションを並び替える

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

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

セクションを追加する

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

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

セクションを削除する

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

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

テーマ設定

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

注意事項

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