BABY サポート
テーマの設定手順と、よくある質問をまとめています。ここで解決しないことは、ページ末尾のお問い合わせからお知らせください。
初期設定の6ステップ
BASE 管理画面の「デザイン」→「デザイン編集」から行います。上から順に進めれば、その日のうちに公開できます。
ロゴ
「基本設定」でロゴ画像かロゴテキストを設定します。ロゴはヘッダーの左、ナビは右に置かれます。画像は高さ 44px に収まるよう縮小されるので、横長の画像がきれいに出ます。テキストは丸みのある英字(Nunito)で表示され、長い店名は折り返します。
背景のトーン
「基本設定」の背景色を決めたら、「テーマ別設定」の「背景のトーン」を合わせます。既定の背景は白ですが、生成り(#FFFBF7 前後)にすると紙の色との相性がよくなります。暗い背景にしたのに罫線が見えないときは、ここが「明るい背景向け」のままです。
色を4つ
アクセント・紙の色・ボタン・ボタンの文字色。既定はアクセントが桃色(#D48C6A)、紙の色が生成り(#FBF1EA)、ボタンがこげ茶(#4A3F3A)です。アクセントは名入れのバッジ・素材チップの点・小見出しに使われます。紙の色は商品写真の下・パネル・サイズのタイル・ドロワーメニューの面になります。
メインビジュアル
横 2000px 以上の横長の写真を1枚(アトリエ、生地、並べた商品)。小見出し(英字推奨)、見出し、説明文、ボタンの文言とリンク先を書き換えます。3 レイアウトから選べます。見出しは読点「、」の位置で折り返します。句読点を使わずに改行したいときは、切りたい位置に縦棒「|」を入れてください(例:「はじめての肌に|やわらかいものを」)。「|」は表示されません。
名入れギフト
小見出し、目安(「名入れ無料 / 3営業日で発送」)、見出し、本文、写真、ボタンの文言とリンク先を設定します。リンク先には名入れできる商品のカテゴリページの URL を。名入れをしない店は、見出しを空欄にすると欄ごと消えます。
出産祝いの目安 3 枚
予算ごとに、写真(正方形推奨)と名前(「¥3,000 くらい」)、おすすめの組み合わせを書きます。贈る側が迷わないための欄です。名前が空欄のカードは消え、3 つとも空欄なら見出しごと消えます。
デザイン設定の一覧
「テーマ別設定」に並ぶ項目です。すべて初期値のままでも動きますが、店に合わせて書き換えると印象が大きく変わります。画像の初期値はすべて空欄です。
全体
| 項目 | 種類 | 初期値・推奨 |
|---|---|---|
| アクセントカラー | 色 | #D48C6A(名入れのバッジ・素材チップの点・小見出し) |
| 紙の色 | 色 | #FBF1EA(商品写真の下・パネル・サイズのタイル・ドロワーメニューの背景色) |
| ボタンの色 | 色 | #4A3F3A |
| ボタンの文字色 | 色 | #FFFFFF |
| 背景のトーン | 選択 | 明るい背景向け / 暗い背景向け |
| 見出しの書体 | 選択 | 丸ゴシック(既定) / 明朝 |
| 商品一覧の列数 | 選択 | 3列(既定) / 4列 / 2列 |
| 商品画像の比率 | 選択 | 正方形 1:1(既定) / やや縦長 4:5 / 縦長 3:4 |
| 商品カードの様式 | 選択 | 紙の色を敷く(既定) / 写真のみ |
| ヘッダーを固定する | ON/OFF | ON |
| 残り1点に「残り1点」を表示 | ON/OFF | ON |
トップページ
| 項目 | 種類 | 初期値・推奨 |
|---|---|---|
| メインビジュアルを表示・レイアウト・画像・文言 | ON/OFF / 選択 / 画像 / 文章 | ON。画像は横 2000 × 縦 1200px を推奨 |
| 贈るシーンから探すを表示・見出し・シーン1〜6の名前 | ON/OFF / 文章 | ON(商品検索App利用時)。出産祝い / 100日祝い / 1歳の誕生日 / 入園 / 男の子 / 女の子。空欄のシーンは非表示 |
| 名入れギフトを表示・小見出し・目安・見出し・本文・ボタン・画像 | ON/OFF / 文章 / 画像 | ON。初期値あり。見出しが空欄なら欄ごと非表示 |
| カテゴリの一覧を表示 | ON/OFF | ON(カテゴリ管理App利用時) |
| 出産祝いの目安を表示・見出し・目安1〜3の写真・名前・説明 | ON/OFF / 画像 / 文章 | ON。初期値は ¥3,000 / ¥5,000 / ¥10,000 くらい。名前が空欄のカードは非表示 |
| 安心のためにを表示・見出し・約束1〜3 | ON/OFF / 文章 | ON。初期値あり。タイトルが空欄の約束は非表示 |
| ストーリーを表示・画像・見出し・本文 | ON/OFF / 画像 / 文章 | ON。初期値あり |
| イベント・出店の予定を表示・見出し・予定1〜3・補足 | ON/OFF / 文章 | ON。初期値あり。日付が空欄の行は非表示 |
| サービス案内を表示・案内1〜3 | ON/OFF / 文章 | ON。初期値あり(名入れ / 配送とラッピング / 洗濯とお手入れ) |
| Instagram の案内を表示 | ON/OFF | ON(SNS設定時) |
| メールマガジンの案内文 | 文章 | 初期値あり(メールマガジンApp利用時) |
About
| 項目 | 種類 | 初期値・推奨 |
|---|---|---|
| About ページの画像 | 画像 | 横 1200px 以上の横長を推奨 |
商品ページ
| 項目 | 種類 | 初期値・推奨 |
|---|---|---|
| 商品説明からバッジ・チップ・タイル・表を自動生成 | ON/OFF | ON |
| 素材と安全について(見出し・本文) | 文章 | 初期値あり(オーガニックコットン、検査、小さな部品を使わない、見守り)。見出しが空欄なら非表示 |
| 洗濯とお手入れ(見出し・本文) | 文章 | 初期値あり(水通し、洗濯機、陰干し) |
| 名入れについて(見出し・本文) | 文章 | 初期値あり(文字の種類、8文字、返品不可) |
| 配送とラッピング(見出し・本文・画像) | 文章 / 画像 | 初期値あり(3営業日、箱とリボン、直送) |
| 交換・返品(見出し・本文) | 文章 | 初期値あり(7日以内・未使用、名入れは不可) |
その他
| 項目 | 種類 | 初期値・推奨 |
|---|---|---|
| フッターの一言 | 文章 | 空欄 |
商品説明の書き方
商品説明の中に次のような行を書くと、対象月齢・サイズ・名入れのバッジ、素材のチップ、サイズのタイル、スペック表が商品ページに作られ、その行は本文から消えます。行の順番は自由で、無い行は出ません。
対象:3〜9ヶ月 サイズ:70 素材:オーガニックコットン(パイル) 着丈:42cm 身幅:26cm 袖丈:22cm 股下:14cm 名入れ:可(無料・ひらがな 8 文字まで) 安全基準:ホルムアルデヒド検査済み 洗濯:洗濯機可、陰干し 色:生成り、くすみピンク 用途:出産祝い、男の子、女の子
バッジ・チップ・タイルになる行
- 対象:16 文字までの値がそのまま月齢のバッジになります(0〜6ヶ月 / 3ヶ月〜 / 1〜3歳 など)。見出し語は 対象 / 月齢 / 対象月齢 / 対象年齢。
- サイズ:12 文字までの値がサイズのバッジになります(70 / 80 / F など)。見出し語は サイズ / サイズ表記。
- 名入れ:「可」「対応」「無料」「あり」「OK」を含む値はバッジになります(「無料」を含めば「名入れ無料」、それ以外は「名入れ可」)。見出し語は 名入れ / 刺繍 / ネーム / イニシャル。値の全文はスペック表の先頭行に入ります。「不可」「なし」はバッジにならず表の行だけになります。
- 素材:「オーガニックコットン、ガーゼ」のように読点・カンマ・スラッシュ・中点で区切ると、ひとつずつチップになります。見出し語は 素材 / 生地 / 材質 / 中綿 / 詰め物 / 糸。12 個まで。
- サイズのタイル:見出し語は 着丈 / 身幅 / 肩幅 / 袖丈 / 総丈 / 股下 / ウエスト / 頭囲 / 足のサイズ / 足長 / 縦 / 横 / 幅 / 高さ / 厚み / 直径 / 長さ / 重さ / 重量。数字だけを書く(「約」「cm」「g」は付けても可)。重さは g、それ以外は cm が既定。数字のあとに言葉が続くと文字のタイルになります。12 個まで。
スペック表になる見出し語
安全基準 / 安全 / 検査 / 認証 / 洗濯 / 洗濯表示 / お手入れ / 色 / カラー / 柄 / セット内容 / 内容 / 製作 / 制作 / 納期 / 発送 / ラッピング / 注意 / 生産 / 産地 / 品番 / 付属品 / 用途 / 対象年齢
全角・半角のコロン(:と :)どちらでも構いません。表にしたくない行は、見出し語の後にコロンを置かなければそのまま本文として表示されます。1行が160文字を超える行は本文のまま残ります。
名入れを注文時に受ける
テーマの名入れバッジと案内文は表示だけです。お客さまに文字を入力してもらうには、BASE の「商品オプション App」を導入して、次のようなオプションを作ります。
- 「文字入れ式」のオプションを作成。名前を「名入れ」、説明を「ひらがな・カタカナ・アルファベットで8文字まで」に、文字数上限を 8 に設定します。
- 糸の色を選んでもらうなら、「選択式」のオプション「糸の色」を作り、「生成り / ピンク / セージ / ネイビー」のように登録します。
- 生まれた日も入れるなら、文字入れ式「生まれた日(例:2026.4.1)」を追加します。
- オプションを対象の商品に適用します。商品ページの数量の下に入力欄が表示されます。
直送と納品書
- ご出産先への直送:BASE の注文画面で、お届け先を購入者と別の住所にできます。テーマの「配送とラッピング」の案内文に、直送できることと、贈り主の名前をメッセージカードに入れられることを書いておきます。
- 納品書の金額:贈りものは金額を見せたくないことが多いので、BASE の設定で納品書に金額を印字しないか、納品書を同梱しない運用にします。
- メッセージカード:商品オプション App の文字入れ式「メッセージカードの文面」(60 文字など)で受けます。
安全表示の書き方
- 事実を書く:「ホルムアルデヒド検査済み(乳幼児用)」「GOTS 認証の生地」「食品衛生法に基づく検査済みの生地と糸」「ボタン・ビーズ不使用」のように、受けた検査や使っていない部品を書きます。
- 断定を避ける:「絶対に安全」「誤飲の心配なし」「アレルギーが出ない」といった表現は避けてください。既定の案内文は「大人の方が見守ってください」を添えています。
- 対象月齢:ひもや小さな部品がある商品は対象月齢を高めに書き、「注意:」の行に理由を書きます。
- 洗濯表示:「洗濯:ネットに入れて洗濯機可(30℃以下)、陰干し、乾燥機不可」のように、温度と乾燥機の可否まで書くと問い合わせが減ります。
紙の色の選び方
「紙の色」は商品一覧と商品ページの写真の下、名入れギフトのパネル、サイズのタイル、素材の枠、出産祝いの目安の写真の下、ドロワーメニュー、カテゴリのドロップダウンに使われます。
- 明るい背景のとき:背景色より少し濃い生成り(例:背景 #FFFBF7 なら紙の色 #FBF1EA)。白い背景で撮った写真が多い店は #FBF5F0 でも合います。
- 暗い背景のとき:背景より少し明るいこげ茶(例:背景 #302826 なら紙の色 #413632)。アクセントは明るい桃色(#E8A98C 前後)、ボタンは明るい色、ボタンの文字色は暗い色に。「背景のトーン」も「暗い背景向け」にしてください。
- ドロワーメニューとパネルもこの色の面になるので、文字色と近い色は避けてください。
写真の撮り方
- 白や生成りの布の上で、真上から:スタイやおくるみは平置きにして真上から。窓を横にして、影がやわらかく出る時間に撮ります。
- 1枚目は正方形で、全体を:商品一覧の既定は正方形です。商品を中央に、周りに余白を残して。紙の色を敷くので、背景が少し違っても揃って見えます。
- 2枚目以降は、名入れの見本・素材の寄り・大きさの比較:パソコンの商品ページでは写真が縦に並びます。全体 → 名入れの刺繍の寄り → 生地の質感 → 手や人形と並べた大きさの比較、の順に。人物の顔が写る写真はサムネイルに使えません。
よくある質問
月齢のバッジが出ません
「対象:」の値が 16 文字を超えると本文に残ります。「対象:0〜6ヶ月(首すわり前から)」のような補足は「注意:」の行に分けて書いてください。
サイズのバッジとタイルの違いは?
「サイズ:70」のような表記サイズはバッジ、「着丈:42cm」のような実寸はタイルです。両方書くと、バッジは商品名の上、タイルは購入ボタンの下に出ます。
首周りのように範囲のある数値は?
「首周り」は見出し語にないので表の行になります。「頭囲:40〜44cm」のように見出し語にある項目で範囲を書くと、文字のタイルになります。数値のタイルにしたいときは「頭囲:42」と代表値だけを書いてください。
色を選んでもらうには?
BASE の商品登録の「種類」(バリエーション)で色を登録すると、購入ボタンの上に選択欄が出ます。在庫は色ごとに管理できます。
ロゴ画像の推奨サイズは?
高さ 44px に縮小して表示されます。横長なら高さ 88px(Retina対応)以上を用意してください。背景が透明な PNG がきれいに出ます。
暗い背景にしたら罫線や文字が見えなくなりました
「テーマ別設定」→「背景のトーン」を「暗い背景向け」にしてください。「紙の色」は背景より少し明るいこげ茶に、「ボタンの色」は明るい色に、「ボタンの文字色」は暗い色に、「アクセント」は明るい桃色に変えてください。
メインビジュアルの見出しが変なところで改行されます
見出しは読点「、」と句点「。」の位置で折り返します。「はじめての肌に、やわらかいものを。」のように、切れてほしい位置に読点を入れてください。句読点を使いたくないときは、切りたい位置に縦棒「|」(全角の「|」でも可)を入れると、その位置で必ず改行します。「|」は画面には表示されません。
HTML を直接編集してもいいですか?
編集はできますが、その時点でテーマの自動更新が止まり、以後の修正が反映されなくなります。設定画面で対応できることは設定画面で行うことをおすすめします。
商品が25件以上あるとき、一覧はどうなりますか?
トップページには最初 24 件を表示し、「もっと見る」を押すと続きが追加されます。商品を開いて戻ったときは、追加読み込み済みの状態とスクロール位置に戻ります。
更新履歴
- 1.0.0
- 初版。BASE デザインマーケットへ申請準備中。