SEN サポート
テーマの設定手順と、よくある質問をまとめています。ここで解決しないことは、ページ末尾のお問い合わせからお知らせください。
初期設定の6ステップ
BASE 管理画面の「デザイン」→「デザイン編集」から行います。上から順に進めれば、その日のうちに公開できます。
ロゴ
「基本設定」でロゴ画像かロゴテキストを設定します。ロゴはヘッダーの中央に置かれます。画像は高さ 40px に収まるよう縮小されるので、横長の画像がきれいに出ます。テキストは英字なら大文字で表示されます。
背景のトーン
「基本設定」の背景色を決めたら、「テーマ別設定」の「背景のトーン」を合わせます。暗い背景にしたのに罫線が見えないときは、ここが「明るい背景向け」のままです。
色を4つ
アクセント・面の色・ボタン・ボタンの文字色。既定はほぼモノクロです。面の色は背景色より少し濃い色にすると、商品写真の下に薄い面が敷かれて一覧が揃います（下の「面の色の選び方」参照）。ボタンを薄い色にするときは文字色を濃くしてください。カートの数字と「LAST 1」のラベルもボタンの色で表示されます。
メインビジュアル
横 2000px 以上の横長の写真を1枚。小見出し（英字推奨）、見出し、説明文、ボタンの文言とリンク先を書き換えます。「全幅の写真に文字を重ねる」「文章と写真を横に並べる」「文字だけ」の3レイアウトから選べます。重ねるときは、写真の左下に文字が入るので、その位置が暗めの写真を選ぶと読みやすくなります。
流れる一行案内
ヘッダーの下に流れる1行の文言を書きます。送料無料の条件、新作の更新日、ラッピングの案内など、全員に伝えたいことを「—」でつないで1行に。空欄にするか OFF にすると消えます。
特集3枚
縦長（4:5）の写真3枚と、名前、リンク先を設定します。リンク先はカテゴリページや商品ページの URL（下の「特集・索引のリンク先」参照）。名前が空欄の特集は消え、3つとも空欄なら見出しごと消えます。
デザイン設定の一覧
「テーマ別設定」に並ぶ項目です。すべて初期値のままでも動きますが、店に合わせて書き換えると印象が大きく変わります。画像の初期値はすべて空欄です。
全体
| 項目 | 種類 | 初期値・推奨 |
|---|---|---|
| アクセントカラー | 色 | #141414（フォーカス枠などの強調色。既定は文字と同じ墨色） |
| 面の色 | 色 | #F2F1EE（商品写真の下・ドロワーメニュー・パネルの背景色。背景色より少し濃い色） |
| ボタンの色 | 色 | #141414 |
| ボタンの文字色 | 色 | #FFFFFF |
| 背景のトーン | 選択 | 明るい背景向け / 暗い背景向け |
| 見出しの書体 | 選択 | ゴシック（モダン） / 明朝（クラシック） |
| 商品一覧の列数 | 選択 | 3列 / 4列 / 2列 |
| 商品画像の比率 | 選択 | 正方形 1:1 / やや縦長 4:5 / 縦長 3:4 |
| 商品一覧の区切り方 | 選択 | 罫線で区切る（隙間のない格子） / 余白で区切る（罫線なし） |
| ヘッダーを固定する | ON/OFF | ON |
| 残り1点に LAST 1 を表示 | ON/OFF | ON |
トップページ
| 項目 | 種類 | 初期値・推奨 |
|---|---|---|
| 流れる一行案内を表示・文言 | ON/OFF / 文章 | ON。初期値あり。空欄で非表示 |
| メインビジュアルを表示 | ON/OFF | ON |
| メインビジュアルのレイアウト | 選択 | 全幅の写真に文字を重ねる / 文章と写真を横に並べる / 文字だけ |
| メインビジュアルの画像 | 画像 | 横 2000 × 縦 1200px を推奨 |
| 小見出し・見出し・説明・ボタンの文言とリンク先 | 文章 | 初期値あり。小見出しは英字推奨。ボタン文言が空欄ならボタン非表示 |
| カテゴリ索引を表示 | ON/OFF | ON（カテゴリ管理App利用時） |
| 特集を表示・特集の見出し | ON/OFF / 文章 | ON。見出しの初期値は Collections |
| 特集1〜3の画像・名前・リンク先 | 画像 / 文章 | 名前の初期値: Tabletop / Textile / Desk。画像は縦長 4:5（横 1200 × 縦 1500px）を推奨。名前が空欄の特集は非表示 |
| ステートメントを表示・小見出し・一文 | ON/OFF / 文章 | ON。初期値あり。一文が空欄なら非表示 |
| ストーリーを表示 | ON/OFF | ON |
| ストーリーの画像・見出し・本文 | 画像 / 文章 | 初期値あり。画像は横 1200 × 縦 900px を推奨 |
| スケジュールを表示・見出し | ON/OFF / 文章 | ON。見出しの初期値は Schedule |
| 予定1〜3の日付・名前・場所・補足 | 文章 | 初期値あり。日付が空欄の行は非表示 |
| サービス案内を表示 | ON/OFF | ON |
| 案内1〜3のタイトルと説明 | 文章 | 初期値あり（Shipping / Gift / Made to order）。タイトルが空欄の列は非表示 |
| Instagram の案内を表示 | ON/OFF | ON（SNS設定時） |
| メールマガジンの案内文 | 文章 | 初期値あり（メールマガジンApp利用時） |
About
| 項目 | 種類 | 初期値・推奨 |
|---|---|---|
| About ページの画像 | 画像 | 横 1200px 以上の横長を推奨 |
商品ページ
| 項目 | 種類 | 初期値・推奨 |
|---|---|---|
| 商品説明からスペック表を自動生成 | ON/OFF | ON |
| 配送と返品（見出し・本文） | 文章 | 初期値あり（発送日数・受注制作・返品の案内）。見出しが空欄なら非表示 |
| ギフトラッピング（見出し・本文・画像） | 文章 / 画像 | 初期値あり |
| お手入れ（見出し・本文） | 文章 | 初期値あり（真鍮と木のものの例） |
| 手仕事の品について（見出し・本文） | 文章 | 初期値あり（寸法・色味・木目や鋳肌の個体差の説明） |
その他
| 項目 | 種類 | 初期値・推奨 |
|---|---|---|
| フッターの一言 | 文章 | 空欄 |
| フッターの大きなショップ名を表示 | ON/OFF | ON（フッターの最下段に英字の大きなショップ名を表示。長い店名のときは OFF に） |
商品説明の書き方
商品説明の中に、次のように「見出し語：内容」の行を書くと、その行が商品ページで罫線の表になり、本文からは消えます。行の順番は自由で、無い行は出ません。
素材：真鍮（無垢） / 牛革（黒） サイズ：リング 直径 3cm / ストラップ 全長 9cm 重さ：約 26g 品番：SEN-KR-01 仕上げ：真鍮は経年で色が深まります 納期：ご注文から 2〜3 週間で発送（受注制作）
表になる見出し語：素材 / 材質 / 原材料 / サイズ / 寸法 / 大きさ / 重さ / 重量 / 容量 / 色 / カラー / 仕上げ / 仕様 / セット内容 / 内容 / 品番 / ブランド / デザイン / 生産 / 製作 / 製造 / 産地 / 原産国 / 納期 / 発送 / お手入れ / 注意 / 対応 / 使用方法 / ラッピング
全角・半角のコロン（：と :）どちらでも構いません。表にしたくない行は、見出し語の後にコロンを置かなければそのまま本文として表示されます。1行が80文字を超える行は本文のまま残ります。
特集・索引のリンク先
「カテゴリ索引」はカテゴリ管理 App のカテゴリを自動で並べるので、設定は要りません（大カテゴリのみ。子カテゴリはカテゴリページで表示されます）。「特集」のリンク先には、ショップ内のどのページの URL でも入れられます。
- カテゴリページ：カテゴリ管理 App を導入し、ショップの画面でそのカテゴリを開いて、アドレスバーの URL をコピーします（例：https://ショップID.base.shop/categories/1234567）。
- 商品ページ：商品を開いて URL をコピーします。人気商品や新作への導線に。
- 検索結果：「https://ショップID.base.shop/search?q=真鍮」のように、商品検索 App の検索結果を特集にすることもできます。商品説明に同じ言葉が入っている商品が並びます。
特集の写真は縦長（4:5）に切り抜かれます。商品写真をそのまま使うときは、上下に余白のある写真を選んでください。
ラッピングやメッセージカードを注文時に選んでもらう
テーマの「ギフトラッピング」の案内は文章と写真だけです。お客さまに注文時に選んでもらうには、BASE の「商品オプション App」を導入して、次のようなオプションを作ります。
- 商品オプション App を導入し、「選択式」のオプションを作成。名前を「ギフトラッピング」、選択肢を「なし」「グレーの箱 + 黒リボン（無料）」「ギフトボックス（+300円）」のように登録します。
- 「文字入れ式」のオプションを作成。名前を「メッセージカード」、文字数上限を 30 文字などに設定します。
- オプションを対象の商品に適用します。商品ページの数量の下に選択欄が表示されます。
テーマの「ギフトラッピング」の本文は、この手順に合わせて「ご注文時にオプションをお選びください」のように書き換えてください。
面の色の選び方
「面の色」は商品一覧と商品ページの写真の下、特集の写真の下、ドロワーメニュー、カテゴリのドロップダウンに使われます。写真の周りではなく「下」に敷かれるので、写真の背景が無地なら、この色が写真の余白のように見えます。
- 明るい背景のとき：背景色より少し濃い無彩色〜生成り（例：背景 #FFFFFF なら面の色 #F2F1EE）。白背景で撮った写真が多い店は、もう少し白に近い #F7F6F4 でも合います。
- 暗い背景のとき：背景より少し明るいチャコール（例：背景 #161616 なら面の色 #242422）。「背景のトーン」も「暗い背景向け」にしてください。
- ドロワーメニューとカテゴリのドロップダウンもこの色の面になるので、文字色と近い色は避けてください。
写真の撮り方
SEN は文字が少ないぶん、写真で印象が決まります。プロの機材は要りませんが、次の3点を揃えると一覧がぐっと整います。
- 背景は無地に：白〜薄いグレーの紙や布の上で撮ると、「面の色」に馴染みます。木目や柄の背景は、ストーリーや特集の写真に回してください。
- 1枚目は正方形で中央に：商品一覧は 1:1（設定で 4:5 / 3:4 に変更可）に切り抜かれます。商品を中央に置き、周りに余白を残して撮ると、どの比率でも欠けません。
- 2枚目以降はディテールと使う場面：パソコンの商品ページでは写真が縦に並びます。全体 → 手元の寄り → 使っている場面、の順に並べると、そのまま読み物になります。
よくある質問
ロゴ画像の推奨サイズは？
高さ 40px に縮小して表示されます。横長なら高さ 80px（Retina対応）以上を用意してください。背景が透明な PNG がきれいに出ます。ロゴはヘッダーの中央に置かれるので、横幅は 360px 程度までが目安です。
暗い背景にしたら罫線や文字が見えなくなりました
「テーマ別設定」→「背景のトーン」を「暗い背景向け」にしてください。背景色と文字色は「基本設定」で、罫線や薄い色はこのトーンで決まります。「面の色」も背景より少し明るい暗めの色に、「ボタンの色」は明るい色に、「ボタンの文字色」は暗い色に変えてください。
流れる一行案内を止めたい
「流れる一行案内を表示する」を OFF にするか、文言を空欄にしてください。マウスを乗せている間は一時停止します。端末で「視差効果を減らす」などの設定をしている人には、最初から静止した状態で表示されます。
スペック表が出ません
「商品説明からスペック表を自動生成」が ON になっているか、見出し語の直後にコロン（：または :）があるかを確認してください。見出し語は上の一覧にあるものだけが対象です。1行が80文字を超えると本文のまま残ります。
商品ページの写真が縦に並ぶのをやめたい
パソコン表示の縦並びは SEN の基本の見せ方で、切替はありません。写真の枚数が多いと長くなるので、商品ページに載せる写真は 3〜6 枚が目安です。スマートフォンでは横にスワイプする形になります。
フッターの大きな店名が途中で切れます
長い店名は 1 行に収まらないと末尾が「…」になります。「フッターの大きなショップ名を表示する」を OFF にするか、ロゴテキストを短くしてください。
受注制作の商品だけ納期を変えたい
共通の「配送と返品」はテーマ別設定の1か所で管理します。商品ごとの制作期間は、商品説明に「納期：ご注文から2週間ほどで発送」と書くと、その商品のスペック表に入ります。
ポップアップ出店中に発送を止めたい
「お知らせバナー App」を導入すると、全ページの上部に「○日までのご注文は○日以降の発送になります」のような帯を出せます。トップページの「スケジュール」の補足文にも書けます。
HTML を直接編集してもいいですか？
編集はできますが、その時点でテーマの自動更新が止まり、以後の修正が反映されなくなります。設定画面で対応できることは設定画面で行うことをおすすめします。
App を入れていないのにメニューが出ています／出ません
Blog・カテゴリ・コミュニティ・メンバーシップ・検索・メールマガジン・言語切替のメニューは、対応する App を導入したときだけ表示されます。導入直後に反映されない場合は、ページを再読み込みしてください。
商品が25件以上あるとき、一覧はどうなりますか？
トップページには最初 24 件を表示し、「More」を押すと続きが追加されます。商品を開いて戻ったときは、追加読み込み済みの状態とスクロール位置に戻ります。
更新履歴
- 1.0.0
- 初版。BASE デザインマーケットへ申請準備中。