FURUGI サポート
テーマの設定手順と、よくある質問をまとめています。ここで解決しないことは、ページ末尾のお問い合わせからお知らせください。
初期設定の6ステップ
BASE 管理画面の「デザイン」→「デザイン編集」から行います。上から順に進めれば、その日のうちに公開できます。
ロゴ
「基本設定」でロゴ画像かロゴテキストを設定します。ロゴはヘッダーの左、ナビは右に置かれます。画像は高さ44pxに収まるよう縮小されるので、横長の画像がきれいに出ます。テキストはコンデンスドの英字(大文字)で表示され、長い店名は折り返します。
背景のトーン
「基本設定」の背景色を決めたら、「テーマ別設定」の「背景のトーン」を合わせます。既定の背景は白ですが、骨色(#F5F2EC 前後)にすると紙の色との相性がよくなります。暗い背景にしたのに罫線が見えないときは、ここが「明るい背景向け」のままです。
色を4つ
アクセント・紙の色・ボタン・ボタンの文字色。既定はアクセントがレンガ色(#B7472A)、紙の色が骨色(#EAE5DC)、ボタンが墨色(#1B1B1B)です。アクセントはコンディション S のバッジ・ダメージの枠・小見出しに使われます。紙の色は実寸のタイル・次回入荷のパネル・ドロワーメニューの面になります(下の「紙の色の選び方」参照)。
メインビジュアル
横2000px以上の横長の写真を1枚。小見出し(英字推奨)、見出し、説明文、ボタンの文言とリンク先を入れます(見出しと説明文の初期値は空欄です)。「全幅の写真に文字を重ねる」「文章と写真を横に並べる」「文字だけ」の3レイアウトから選べます。見出しは読点「、」の位置で折り返します。句読点を使わずに改行したいときは、切りたい位置に縦棒「|」を入れてください(例:「一点ものの服を|次に着る人へ」)。「|」は表示されません。
次回入荷
小見出し、日時、見出し、本文、写真、ボタンの文言とリンク先を設定します。リンク先には新着のカテゴリページや、入荷リストを載せた Blog の記事の URL を(下の「次回入荷・探す」参照)。入荷の予定がない時期は見出しを空欄にすると、パネルごと消えます。
コンディションの目安
4段階の記号(S / A / B / C など)と説明を、店の基準で書き入れます(初期値は空欄です)。ここに書いた内容は、トップページと全商品ページの「コンディションの目安」の両方に入ります。商品説明の「コンディション:B」は、この記号と照合されてバッジになります(下の「コンディションの記号」参照)。
デザイン設定の一覧
「テーマ別設定」に並ぶ項目です。文章の初期値は見出しだけで、本文・日時・名前などはすべて空欄です(実在の店の情報と取り違えないように)。空欄の欄は表示されないので、使う欄から書き入れてください。画像の初期値もすべて空欄です。
全体
| 項目 | 種類 | 初期値・推奨 |
|---|---|---|
| アクセントカラー | 色 | #B7472A(コンディション S のバッジ・ダメージの枠・小見出し・強調色) |
| 紙の色 | 色 | #EAE5DC(実寸のタイル・パネル・ドロワーメニューの背景色。背景色より少し濃い色) |
| ボタンの色 | 色 | #1B1B1B |
| ボタンの文字色 | 色 | #FFFFFF |
| 背景のトーン | 選択 | 明るい背景向け / 暗い背景向け |
| 見出しの書体 | 選択 | ゴシック + コンデンスド英字(既定) / 明朝 + セリフ英字 |
| 商品一覧の列数 | 選択 | 4列(既定) / 3列 / 2列 |
| 商品画像の比率 | 選択 | 縦長3:4(既定) / 正方形1:1 / やや縦長4:5 |
| 商品カードの様式 | 選択 | 写真のみ(既定) / 紙の色を敷く |
| ヘッダーを固定する | ON/OFF | ON |
| 売り切れの商品写真を薄くして「SOLD」の印 | ON/OFF | ON |
トップページ
| 項目 | 種類 | 初期値・推奨 |
|---|---|---|
| メインビジュアルを表示・レイアウト・画像・文言 | ON/OFF / 選択 / 画像 / 文章 | ON。全幅の写真に文字を重ねる(既定) / 横に並べる / 文字だけ。画像は横2000 × 縦1200pxを推奨。文言は小見出し「Vintage clothing」とボタン「新着を見る」以外は空欄。画像も見出しもなければ欄ごと非表示 |
| 次回入荷を表示・小見出し・日時・見出し・本文・ボタン・画像 | ON/OFF / 文章 / 画像 | ON。小見出し「Next drop」とボタン「新着を見る」以外は空欄。見出しが空欄なら欄ごと非表示。画像は横1200 × 縦800pxを推奨 |
| 探すを表示・見出し | ON/OFF / 文章 | ON。見出しの初期値は「探す」 |
| リンク1〜6の名前とURL | 文章 | 名前は空欄(例:メンズ / レディース / アウター)。URL の初期値は商品一覧。名前が空欄の行は非表示。6つとも空欄なら見出しごと非表示 |
| カテゴリの一覧を表示 | ON/OFF | ON(カテゴリ管理App利用時) |
| コンディションの目安を表示・見出し・段階1〜4の記号と説明 | ON/OFF / 文章 | ON。見出しの初期値は「コンディションの目安」、記号と説明は空欄。記号が空欄の段階は非表示、4つとも空欄なら欄ごと非表示。商品ページの案内にも同じ内容が入る |
| 採寸についてを表示・見出し・本文・図・項目1〜4 | ON/OFF / 文章 / 画像 | ON。見出しの初期値は「採寸について」、本文と項目は空欄(例:着丈 / 身幅 / 肩幅 / 袖丈と、それぞれの測り方)。図は横1200 × 縦900pxを推奨。図も本文も項目もなければ欄ごと非表示 |
| ストーリーを表示・画像・見出し・本文 | ON/OFF / 画像 / 文章 | ON。見出しの初期値は「店のこと」、本文は空欄。画像は横1200 × 縦900pxを推奨。画像も本文もなければ欄ごと非表示 |
| 出店・POP UPの予定を表示・見出し・予定1〜3・補足 | ON/OFF / 文章 | ON。見出しの初期値は Pop up、予定と補足は空欄。日付が空欄の行は非表示。3つとも空欄なら見出しごと非表示 |
| サービス案内を表示・案内1〜3 | ON/OFF / 文章 | ON。空欄。タイトルが空欄の列は非表示。3つとも空欄なら欄ごと非表示 |
| Instagram の案内を表示 | ON/OFF | ON(SNS設定時) |
| メールマガジンの案内文 | 文章 | 空欄(メールマガジンApp利用時。空欄なら見出しと登録欄だけ) |
About
| 項目 | 種類 | 初期値・推奨 |
|---|---|---|
| About ページの画像 | 画像 | 横1200px以上の横長を推奨 |
商品ページ
| 項目 | 種類 | 初期値・推奨 |
|---|---|---|
| 商品説明からタイル・バッジ・表を自動生成 | ON/OFF | ON |
| 古着について(見出し・本文) | 文章 | 空欄。見出しが空欄なら非表示。使用感の前提、洗濯と補修、写真との色の違いなどを書いておくと問い合わせが減ります |
| 返品・交換について(見出し・本文) | 文章 | 空欄。返品を受ける条件、交換の可否、記載のないダメージがあったときの対応など |
| 配送について(見出し・本文) | 文章 | 空欄。発送までの日数、送料、追跡番号の連絡など |
| お手入れについて(見出し・本文) | 文章 | 空欄。洗い方、干し方、革やウールの扱いなど |
その他
| 項目 | 種類 | 初期値・推奨 |
|---|---|---|
| フッターの一言 | 文章 | 空欄 |
商品説明の書き方
商品説明の中に次のような行を書くと、コンディションとサイズのバッジ・実寸のタイル・ダメージの箇条書き・スペック表が商品ページに作られ、その行は本文から消えます。行の順番は自由で、無い行は出ません。
ブランド:Levi's 年代:1970s 生産国:USA サイズ:W31 L32 コンディション:B ウエスト:78cm 股上:30cm 股下:76cm わたり:30cm 裾幅:20cm 素材:コットン100% ダメージ:右膝に薄いアタリ、裾にわずかなほつれ、ボタン裏に錆 モデル:175cm 62kgでジャスト
バッジ・タイル・箇条書きになる行
- コンディション:S / A / B / C のように、「コンディションの目安」で決めた記号を書きます。見出し語は コンディション / 状態 / ランク。「B(使用感あり)」とかっこで補足を付けると、バッジに小さく添えられます。記号の代わりに「デッドストック」「美品」「使用感あり」「難あり」などの言葉を書いても、近い段階に判定します。
- サイズ:「M」「W31 L32」「表記34」のように24文字まで。見出し語は サイズ / 表記サイズ / サイズ表記。商品名の上のサイズバッジになります。
- 実寸:「着丈:68cm」のように、見出し語のあとに数字だけを書きます(「約」「cm」は付けても付けなくても可)。1行にまとめるときは「実寸:着丈68身幅52肩幅45袖丈60」や「実寸(cm):着丈70 / 身幅64 / 肩幅55」のように。「フリー」のような文字はそのままタイルに入ります。見出し語は次のとおりです。
着丈 / 身丈 / 身幅 / 肩幅 / 袖丈 / ゆき / ゆき丈 / 裄丈 / ウエスト / 股上 / 股下 / わたり / わたり幅 / 裾幅 / ヒップ / 太もも / 総丈 / 全長 / スカート丈 / パンツ丈 / 胸囲 / 胴回り / 首周り / 頭周り / つば / 持ち手 / ショルダー / マチ / ヒール / アウトソール / 足幅 / 高さ / 幅 / 丈 - ダメージ:「右膝に薄いシミ、裾にほつれ」のように読点・カンマ・スラッシュ・中点で区切ると、レンガ色の枠の中の箇条書きになります。見出し語は ダメージ / 難あり / 汚れ / 傷 / 注意点。「なし」「特になし」と書いた行はスペック表の行になります。かっこの中に読点があるとそこでも区切られるので、補足は「背中に裂け(補修済み)」のように読点を使わずに。
スペック表になる見出し語
ブランド / メーカー / 年代 / 生産国 / 製造国 / 原産国 / 素材 / 混率 / 生地 / カラー / 色 / モデル / 着用 / 着用モデル / 性別 / ジェンダー / 品番 / 商品番号 / タグ / 付属品 / 洗濯 / お手入れ / 仕入れ / 仕入れ先 / 状態の詳細 / 種類 / カテゴリ / 柄 / シルエット / 用途 / 定価 / 発送 / 注意 / 備考
全角・半角のコロン(:と :)どちらでも構いません。表にしたくない行は、見出し語の後にコロンを置かなければそのまま本文として表示されます。1行が160文字を超える行は本文のまま残ります。
次回入荷・探す
次回入荷
- 入荷する商品を「新着」などのカテゴリにまとめるか、入荷リストを Blog の記事にします。
- そのカテゴリページか記事の URL をコピーし、テーマ別設定の「ボタンのリンク先URL」に貼り付けます。
- 日時欄に「9.12 (Fri) 20:00」のように書き、見出しと本文に何が何点入るかを書きます。写真は箱を開けたところや、入荷分の一部を。
- 入荷が終わったら、見出しを空欄にするか「次回入荷を表示」を OFF にします。次の入荷が決まったら、また書き込みます。
入荷の30分前にメールマガジンで全点の写真を配信する、Instagram で予告する、といった運用と組み合わせると、パネルの下の「メールマガジン」欄と「Instagram」の導線が活きます。
探す
名前とリンク先の組を6つまで置けます。リンク先には、カテゴリ管理 App で作ったカテゴリページの URL(ショップで開いてアドレスバーからコピー)や、商品検索 App の検索結果の URL(例:https://ショップのドメイン/search?q=デニム)を入れます。メンズ / レディース / アウター のような大きな入口をここに置き、細かい分類はカテゴリの一覧に任せる使い方がおすすめです。名前を空欄にした行は消えます。
コンディションの記号を変える
「コンディションの目安」の段階1〜4の記号と説明は自由に書けます(初期値は空欄。空欄のあいだは S / A / B / C の並びで判定します)。商品説明の「コンディション:」に書いた記号は、この4つの記号と照合され、一致した段階のバッジになります(段階1はアクセント色、段階4は枠線だけ)。
- A / B / C / D にしたい:段階1〜4の記号に A、B、C、D と書き、商品説明にも同じ記号を書きます。
- 3段階にしたい:段階4の記号を空欄にします。トップページと商品ページの目安が3つになります。
- AA / A / B / C にしたい:段階1を AA に。商品説明に「コンディション:AA」と書けば段階1のバッジです。
- 記号が目安と一致しないときは、S・A・B・C・D の一般的な並びで判定します。「美品」「デッドストック」「難あり」などの言葉からも判定します。どれにも当てはまらない値は、そのままバッジに表示します(3文字まで)。
裾上げや股下の指定を注文時に受ける
パンツの裾上げや、股下の指定を注文時に受けるには、BASE の「商品オプション App」を導入して、次のようなオプションを作ります。テーマはそのオプション欄を、購入ボタンの上に並べます。
- 「選択式」のオプションを作成。名前を「裾上げ」、選択肢を「なし」「あり(+1,000円)」のように登録します。
- 「文字入れ式」のオプションを作成。名前を「股下の指定」、説明を「仕上がりの股下を cm で入力してください」に、文字数上限を30文字などに設定します。
- オプションを対象の商品(パンツ)に適用します。
- 裾上げ後は返品を受けないなら、「返品・交換について」の本文にその旨を書き足してください。
紙の色の選び方
「紙の色」は実寸のタイル、次回入荷のパネル、採寸の図の下、ドロワーメニュー、カテゴリのドロップダウン、「紙の色を敷く」にしたときの商品写真の下に使われます。
- 明るい背景のとき:背景色より少し濃い骨色(例:背景 #F5F2EC なら紙の色 #EAE5DC)。白い壁の前で撮った写真が多い店は、もう少し白に近い #F0EDE6 でも合います。
- 暗い背景のとき:背景より少し明るい墨色〜グレー(例:背景 #141414なら紙の色 #262524)。「背景のトーン」も「暗い背景向け」にしてください。アクセントは少し明るいレンガ色(#D96B4A 前後)、ボタンは明るい色、ボタンの文字色は暗い色にすると読みやすくなります。
- ドロワーメニューとパネルもこの色の面になるので、文字色と近い色は避けてください。
写真の撮り方
- 同じ背景、同じ向きで:商品一覧の既定は「写真のみ」の4列です。白壁やコンクリートの床など、全商品を同じ背景・同じ向き(平置きは真上から、トルソーは正面から)で撮ると、一覧がカタログのように揃います。背景が揃わないときは「紙の色を敷く」に。
- 1枚目は全体を縦長で:既定の比率は3:4の縦長です。服の全体が入るよう、周りに少し余白を残して。
- 2枚目以降は、タグ・ダメージ・ディテール:パソコンの商品ページでは写真が縦に並びます。全体 → 背面 → タグ → ダメージの寄り → 着用、の順に並べると、ダメージの欄と対応がつきます。
よくある質問
実寸のタイルが出ません
「商品説明からタイル・バッジ・表を自動生成」が ON になっているか、「着丈:」のあとにコロン(:または :)があるかを確認してください。数字の前に別の言葉があると(「着丈:約68cm前後」など)読み取れません。数字だけ、または「約68cm」の形で書いてください。
コンディションのバッジが出ません、または違う段階になります
商品説明の記号が「コンディションの目安」の記号と一致しているか確認してください(大文字・小文字は区別しません)。目安を OFF にしているとき、または記号が空欄のときは S / A / B / C / D の並びで判定します。「良好」「使用感あり」は B、「美品」は A、「デッドストック」「未使用」は S、「難あり」「ダメージあり」は C になります。
売り切れの商品を薄くしたくありません
「テーマ別設定」→「売り切れの商品写真を薄くして「SOLD」の印を付ける」を OFF にしてください。通常の「SOLD」バッジだけが残ります。
「残り1点」のラベルはありますか?
ありません。古着はほぼ全品が在庫1なので、全商品に「残り1点」が付いてしまいます。数があるものは商品名や説明に「在庫3」のように書くか、ラベル App をお使いください。
ロゴ画像の推奨サイズは?
高さ44pxに縮小して表示されます。横長なら高さ88px(Retina対応)以上を用意してください。背景が透明な PNG がきれいに出ます。
暗い背景にしたら罫線や文字が見えなくなりました
「テーマ別設定」→「背景のトーン」を「暗い背景向け」にしてください。「紙の色」は背景より少し明るい墨色に、「ボタンの色」は明るい色に、「ボタンの文字色」は暗い色に、「アクセント」は明るいレンガ色に変えてください。
メインビジュアルの見出しが変なところで改行されます
見出しは読点「、」と句点「。」の位置で折り返します。「一点ものの服を、次に着る人へ。」のように、切れてほしい位置に読点を入れてください。句読点を使いたくないときは、切りたい位置に縦棒「|」(全角の「|」でも可)を入れると、その位置で必ず改行します。「|」は画面には表示されません。
POP UP の期間に発送を止めたい
「お知らせバナー App」を導入すると、全ページの上部に「○日〜○日は出店のため、発送は○日以降になります」のような帯を出せます。トップページの「出店・POP UPの予定」の補足文にも書けます。
HTML を直接編集してもいいですか?
編集はできますが、その時点でテーマの自動更新が止まり、以後の修正が反映されなくなります。設定画面で対応できることは設定画面で行うことをおすすめします。
商品が25件以上あるとき、一覧はどうなりますか?
トップページには最初24件を表示し、「もっと見る」を押すと続きが追加されます。商品を開いて戻ったときは、追加読み込み済みの状態とスクロール位置に戻ります。商品数が多い店は、「探す」とカテゴリで入口を分けておくと探しやすくなります。
更新履歴
- 1.0.0
- 初版。BASE デザインマーケットへ申請準備中。