#2HOME設定（スライド/Pickup/商品一覧など）

メイン画像（スライドショー）の設定

トップページを開くと最初に表示されるメインビジュアル。印象的な写真でブランドイメージを表現します。

💡

ポイント

写真は最大3枚、それぞれスマホ用縦画像を設定可能
写真1つにつきキャッチコピー、サブテキスト高さ、文字サイズ、右下に表示する商品カードの設定が可能

メインイメージ切替エフェクト	HOMEのメインビジュアルの切り替え演出を選択します。複数枚のメインイメージを設定した場合に反映されます。 Type1 横方向カルーセルスライド：左右にスライドするカルーセル形式です。操作感がわかりやすく、複数ビジュアルを見せたい場合に向いています。 Type2 スクロール固定/上下ワイプ：画面を固定し、上下スクロール操作によりワイプで切り替わる演出です。 Type3 スクロール固定/クロスフェード：画面を固定し、上下スクロール操作により、やわらかなフェードで切り替わる演出です。 Type4 エフェクトなしのタイル表示：切替演出を使わず、画像をそのまま並べて見せる表示です。（後述するサムネイル表示は1枚目のみとなります） 💡 Type2・Type3 はType2・Type3はビジュアル写真への没入感を持たせるおすすめのエフェクトです。一瞬画面をスクロールできない感覚があるため、サイト設定作業などで何度も表示することを想定し、初期設定はあえてType1としています。
メインイメージ上の文字色	メインイメージ上にある場合の文字色を設定します。スクロールしてヘッダーがメインイメージを通り過ぎると全体のテキストカラーに変化します。メインイメージの写真に合わせて読みやすい色を選択してください。カテゴリーヘッダーや商品ページでもヘッダー画像を表示させることができますが、この色設定がサイト全体で適用されます。
メインイメージを暗くする	メインイメージの上に暗めのオーバーレイを重ね、キャッチコピーや説明文を読みやすくします。画像が明るい場合や、文字の視認性を優先したい場合に有効です。
メインイメージ1〜3	1〜3枚目のメインビジュアル画像を設定します。画面比率に応じてクロップされるため、特に推奨する縦横比率はありません。もちろん、極端な比率ではクロップ部分が大きくなってしまいうので、基本的にはPC向けの横長画像がおすすめです。
メインイメージ（スマホ用縦画像）	スマホ用に縦画像を設定できます。同じ画像で、縦長に編集した写真を設定しておくと自動で切り替わります。メインイメージのみで、スマホ表示のクロップが気にならなければ設定する必要はありません。
メインイメージキャッチコピー	画像の上にテキストを表示します。
メインイメージサブテキスト	キャッチコピー下のサブテキスト。見出しを補う一文や、ブランド説明の短い導入文として使います。
メインイメージ文字サイズ	キャッチコピーとサブテキストの文字サイズを選択します。
メインイメージサムネイル商品ID	メインイメージの内で商品を着用している場合など、雑誌の商品紹介のように右下に商品情報を最大3件まで表示することができます。入力欄に「商品ID」を「改行区切り」で入力します。商品IDは商品登録画面や、商品ページのURLの最後の8桁の数字です。（半角数字8桁である商品ID以外に、スペースや他の文字が入っていると表示できません。）

💡

メイン写真のサイズを教えてください

「ファイルサイズ / 画像のピクセルサイズ / 縦横比」の違いを理解しておきましょう。
上にもある通りメインビジュアルエリアは表示されている画面の比率に応じてうまくクロップされるため、画像自体の縦横比に厳密な推奨値はありません。大まかにPC用の横長画像、スマホ用に縦長画像、としています。

画像のピクセルサイズは表示されうる最大サイズを想定します。メインビジュアルは画面いっぱいに表示しますが、一般的な大きなディスプレイを想定したとしても2000pxあれば十分だと言われています。写真により1200pxでも問題なく見えることもあります。
あとは画質をできるだけ落とさない範囲で、ファイルサイズを小さく書き出しましょう。

💡

メイン写真の数を増やしたい

デザインテーマにはコード量の制限があるため、スライド画像の数も必要最小限の数を設定できるようにしています。3枚以上に増やしたい場合、HTML編集Appで編集が必要です。もし難しい場合、オーダーメイドサービスをご検討ください。

一般的に「サイトオーナーは沢山見せたい」と思いがちな一方、「見る側はそこまで長く滞在してじっくりみない」という現実もあるため、最大でも3枚としてこまめに変更してさまざまなパターンを発信することをお勧めしています。

コンセプトセクション

コンセプト見出し	コンセプトセクションの見出しを設定します。ブランドの軸になる言葉や、世界観を表す短いタイトルを入れる想定です。
コンセプト文章	コンセプトセクションの本文を設定します。ショップの考え方や、取り扱う商品の方向性などを簡潔に説明します。

Pickup商品

ピックアップカテゴリーの設定

Pickup商品表示	HOMEにピックアップ商品セクションを表示するか切り替えます。ONにすると、指定した商品や特集的な見せ方を行うセクションが表示されます。
タイトル	Pickupセクション全体の見出しを設定します。あああああ<span>いいいい</span> のようにタグを入力することで、英字タイトルと日本語サブタイトルのような見せ方ができます。サブタイトルが不要であれば削除しても問題ありません。タグを思い出したいときは、このマニュアルからコピーしてペーストすると便利です。
Pickup 01〜03 商品名	ピックアップ商品のタイトルを設定します。
Pickup 概要文	商品の説明文を設定します。特徴やおすすめポイントを短く記載する用途です。
Pickup 画像	表示する画像を設定します。商品画像や商品イメージ写真など。
Pickup 商品ページURL	1件目のリンク先URLを設定します。通常は該当商品の商品ページURLを入力します。

カテゴリー一覧表示	HOMEにカテゴリー一覧を表示します。カテゴリーごとの画像は、デザイン設定の「App設定」にて行うことができます。

ブランド・タグ表示

タグ表示（例：取扱いブランド）	HOMEにブランド一覧やタグ一覧のようなセクションを表示するか切り替えます。カテゴリー構造を活用して、取扱ブランド一覧のように見せる用途を想定しています。
タイトル	ブランド一覧セクションの見出しを設定します。
対象の大カテゴリーID	ブランド一覧として表示したい親カテゴリーIDを指定します。指定した親カテゴリーの配下にある中カテゴリーを一覧表示する構成です。

商品一覧の見出し

◾️商品一覧の見出し	HOMEの商品一覧セクションの見出しを設定します。HOMEの商品一覧は登録商品が新しい順に表示されるというのがBASEの仕様となっています。そのままであれば「新着商品」ですが、商品管理の並べ替えを行い「人気商品」など見せたい内容に合わせてタイトルを調整することも可能です。

注目カテゴリー紹介パネル

カテゴリーパネル画像	注目カテゴリー紹介パネルに表示する画像を設定します。画像の有無で、カテゴリーパネル全体のON/OFFが切り替わります。
背景色	注目カテゴリー紹介パネルの背景色を設定します。
文字色	注目カテゴリー紹介パネルの文字色を設定します。
見出し	注目カテゴリー紹介パネルのタイトルを設定します。
文章	注目カテゴリーの説明文を設定します。そのカテゴリーの特徴やおすすめ内容を短く紹介する用途です。
カテゴリーID	紹介対象にしたい大カテゴリーIDを指定すると、その中カテゴリー名がボタンで表示されます。（カテゴリーIDとは、そのカテゴリーページを表示させたときのURLの末尾にある8桁の半角数字です。）

新着ブログ	HOMEにブログの新着一覧を表示するか切り替えます。ブログAppのインストールと、少なくとも4件ほどのブログ記事があることが前提のレイアウトです。
タイトル	ブログセクションの見出しを設定します。
画像ありレイアウト	ブログ一覧を画像付きで表示するか切り替えます。 ON：記事画像を含めたレイアウトになります。 OFF：文字だけのシンプルな一覧表示になります ONにしたのに、ブログ記事に画像がないとグレーの空白画像となりまので、１つ１つのブログに必ず画像をつけるかどうかを決めておくことをおすすめします。この設定は、HOMEの新着エリアだけではなくBLOGページにも反映されます。。
ブログ固定記事ラベル	「ブログの固定記事は、その記事のタイトルを画面上部に表示する」というのがBASEの共通ルールとなっています。その際、タイトルの前に表示するラベル文言を設定します。「大切なお知らせ」「PICK UP」などの用途を想定しています。空欄にすることも可能です。

レビュー（独自のレビュー表示）

この機能はデザインの1つとしてお客様の声を表示させることができます。「レビューApp」から投稿されるものではなく、ショップオーナーが表示したい内容を表示できます。

レビュー	HOMEにレビューセクションを表示するか切り替えます。お客様の声や評価を見せたい場合に使用します。
タイトル	レビューセクションの見出しを設定します。
Review 01〜04 レビュー本文	1件目のレビュー本文を設定します。<span>★★★★★</span> という書式でそのレビューの星の数を入力することで、星の数による表示を含められます。
Review レビュワー名前	本文の下に投稿者名や地域表記など表示できます。
Review 対象商品の画像	どの商品に関するレビューであるかを紹介する商品画像を設定します。
Review 対象商品URL	商品画像にリンクを設定できます。

トップページを表示させた時に前面に表示されるポップアップバナー

バナー画像（画像で表示ON）	HOME表示時のポップアップバナー画像を設定します。画像を設定すると、トップページ上でバナー表示機能が有効になります。
表示確認モード	ポップアップバナーは、同じ人に何度も表示されることのないよう、最初にアクセスされて表示した後は、経過時間やセッションによりしばらく表示されなくなります。設定作業時のみONにして、設定が終わったらOFFにしてください。
見出し	ポップアップバナーのタイトルを設定します。見出しがあれば、画像と文字を組み合わせたレイアウトに、見出しが空欄の場合は画像のみのシンプルなレイアウトで表示されます。
説明文	本文を設定します。セール告知、会員登録案内、新着情報などの説明に使います。
リンク先	クリックした際の遷移先URLを設定します。
バナー文字色	テキストを入れる際の文字色を設定します。
バナー背景色	テキストエリアの背景色を設定します。

← #1 全体設定 #3 ABOUT設定 →