ストアフロントモード — ハイブリッド、B2B 専用、B2C 専用
Storefront mode トグルは、Vertex で最も重要な B2B 関連テーマ設定です。これは、どの B2B 要素 — コバルトブルーのグリーティングバー、営業担当ピル、NET 条件バッジ、RFQ リンク、一括注文リンク、B2B プロモストリップ、その他あらゆる B2B 風の要素 — が実際にストアフロントに表示される かを制御します。
この設定は Customize ▸ Theme settings ▸ B2B ▸ Storefront mode にあり、3 つのオプションがあります:
- Hybrid(推奨) — サインイン中の人物を自動検出します。両方のオーディエンスが適切な UI を取得します。
- B2B-only — B2C 向けのデフォルトを非表示にします。ストアはすべての訪問者を取引アカウントとみなします。
- B2C-only — UI のすべての B2B 要素を抑制します。サインイン済みの B2B バイヤーにもストアフロントの B2C 版が表示されます。
標準では、Vertex は Storefront mode が Hybrid に設定された状態で出荷されます。ほとんどのマーチャントにとって、これが正しい設定であり、変更する必要はありません。
3 つのモードの概要
| モード | 最適な対象 | バイヤーが見る内容 |
|---|---|---|
| Hybrid | ほとんどのマーチャント。取引アカウントと一般来店 / 小規模ビジネス顧客の両方に販売。 | サインイン済み B2B バイヤーには B2B 要素が自動表示。ゲストと小売顧客には B2C UI。 |
| B2B-only | 決して小売販売をしない卸売専用マーチャント。取引専用カタログ。販売店ネットワーク。 | B2B 要素がどこでもデフォルト。サインアップパスは 「取引アカウントを作成」 がデフォルト。RFQ と一括注文リンクは常に表示。 |
| B2C-only | 小売ブランドとして同じテーマを動作させる姉妹店。B2B をまだ公開せずにソフトローンチ。 | あらゆる B2B 要素が抑制 — サインイン済み B2B バイヤーにも。洗練された工業用品 B2C テーマのように見えます。 |
横並びの判断マトリクス
このマトリクスを使用して、各モードでどの UI 要素が表示されるかを正確に予測できます。G = ゲスト。B2C = サインイン済みの小売顧客。B2B = サインイン済みの B2B バイヤー。
| UI 要素 | Hybrid (G / B2C / B2B) | B2B-only (G / B2C / B2B) | B2C-only (G / B2C / B2B) |
|---|---|---|---|
| コバルトブルーの B2B グリーティングバー(ヘッダー 上部) | — / — / ✓ | — / — / ✓ | — / — / — |
| グリーティングバー内の 会社名 + バッジ | — / — / ✓ | — / — / ✓ | — / — / — |
| NET-30 / NET-60 / NET-90 バッジ | — / — / ✓ | — / — / ✓ | — / — / — |
| 免税バッジ | — / — / ✓ | — / — / ✓ | — / — / — |
| 営業担当ピル(デスクトップヘッダー) | — / — / ✓ | — / — / ✓ | — / — / — |
| 配送先ロケーションスイッチャー | — / — / ✓ | — / — / ✓ | — / — / — |
| 会社スイッチャー(複数会社のバイヤー) | — / — / ✓ | — / — / ✓ | — / — / — |
| ボリューム価格テーブル(商品ページ) | — / — / ✓ | — / — / ✓ | — / — / — |
| 数量ルール適用(MOQ / 最大 / 増分) | — / — / ✓ | — / — / ✓ | — / — / — |
| メインナビゲーション内の RFQ リンク | ✓ / ✓ / ✓ | ✓ / ✓ / ✓ | — / — / — |
| メインナビゲーション内の 一括注文リンク | ✓ / ✓ / ✓ | ✓ / ✓ / ✓ | — / — / — |
| B2B 機能プロモストリップ(ホームページ) | ✓ / — / — | ✓ / ✓ / ✓ | — / — / — |
| 「取引アカウントを作成」 CTA(「サインアップ」の代わり) | — / — / — | ✓ / ✓ / ✓ | — / — / — |
| 「サインアップ」 CTA(B2C デフォルト) | ✓ / — / — | — / — / — | ✓ / — / — |
| B2B 対応アカウントダッシュボード | — / — / ✓ | — / — / ✓ | — / — / — |
| カート NET 条件バッジ | — / — / ✓ | — / — / ✓ | — / — / — |
| Hide prices until customer logs in(有効時) | ゲスト非表示 | ゲスト非表示 | ゲスト非表示 |
凡例:
- ✓ — 要素が表示される
- — — 要素が非表示 / 描画されない
カタログスコーピング(B2B バイヤーは割り当てられたカタログ内の商品のみ閲覧可能)は、Storefront mode に関係なく Shopify 自体によって適用されます。B2C 専用モードでも、サインイン済みの B2B バイヤーにはカタログの商品のみが表示されますが、その周囲の B2B クロームは表示されません。
モード 1 — Hybrid(ほとんどのマーチャントに推奨)
Hybrid はデフォルトであり、約 80% のマーチャントにとって正しい答えです。 各訪問者(ゲスト、B2C 顧客、または B2B バイヤー)を自動検出し、適切な UI を描画します。
Hybrid を使うべき人
- 取引アカウント(条件、カタログ、ボリューム価格付き)と一般来店 / 小規模ビジネス顧客の 両方 に販売する。
- 1 つの URL、1 つのテーマ、1 つの商品カタログが欲しい — しかし検証済みのバイヤーには B2B 特典をレイヤーで重ねたい。
- 小規模請負業者、ホビイスト、エンドユーザーが小売バイヤーである工業用品 / MRO マーチャント。
Hybrid の動作
| 訪問者タイプ | Hybrid が描画する内容 |
|---|---|
| ゲスト | 洗練された B2C ストアフロント。マーケティングとしてホームページに B2B 機能プロモストリップ。ナビゲーションに RFQ と一括注文リンク(ゲストでも RFQ を送信して取引アカウントを開始可能)。 |
| B2C 顧客(サインイン中) | 同じ B2C UI。B2B プロモストリップなし(すでに顧客のため)。B2B グリーティングバーなし(会社に所属していないため)。 |
| B2B バイヤー(サインイン中) | 完全な B2B UI — コバルトブルーのグリーティングバー、会社名、NET 条件と免税バッジ、配送先スイッチャー、営業担当ピル、ボリューム価格テーブル、数量ルール適用、B2B 対応アカウントダッシュボード。 |
なぜ推奨か
- 誤って間違ったオーディエンスから機能を非表示にするリスクがゼロです。
- カタログスコーピングは、そう望む場合に B2B 専用商品をゲストから隠したままにします。
- 各オーディエンスは 「このストアフロントは自分を理解している」 と感じる UI を得ます。
モード 2 — B2B-only
B2B-only モードでは、ストアフロントは全員が(または将来的に)取引アカウントになるとみなします。サインアップ CTA は 「取引アカウントを作成」 がデフォルトになります。B2B 機能プロモストリップは全員 — サインイン済みの小売顧客にも — 表示されます。このモードでは小売顧客は実質的に存在すべきではないためです。RFQ と一括注文リンクは常に表示されたままになります。
B2B-only を使うべき人
- 卸売専用マーチャント。 検証済みの取引アカウントにのみ販売。小売 SKU も消費者向けチェックアウトフローもない。
- 販売店または流通業者ネットワーク。 バイヤーは全員、条件付きの承認済みチャネルパートナー。
- 取引専用カタログ。 工業薬品、重機、規制対象の医療用品、業界専用の認証などの製品。
- 匿名ブラウジング は引き続き許可できます — ただし価格を見たりチェックアウトしたい人はサインインが必須です(最も強力なゲートにするには、B2B-only を Hide prices until customer logs in テーマ設定と組み合わせます)。
B2B-only による変更
- すべてのサインアップパス が 「取引アカウントを作成」 にルーティングされます — バイヤーは汎用の登録ページではなく、取引申請フォームに誘導されます。
- B2B プロモストリップ は、アカウント保有の価値を伝えるため常に表示されます。
- RFQ と一括注文リンク は(ゲストを含む)全員のためにナビゲーションに固定されます。
- B2B クローム は描画にサインインが依然として必要です(グリーテ ィングバー、営業担当ピル、NET 条件バッジ) — これは Vertex の選択ではなく Shopify の制約です。しかし、他のすべての UI シグナルは訪問者を取引アカウントステータスへと促します。
Hybrid と同じままの内容
- ボリューム価格、NET 条件バッジ、免税バッジ、営業担当ピル — すべて引き続き描画にサインイン済みの B2B バイヤーが必要です。
- カタログスコーピングは変更なしです。
- B2C 向けのデフォルト(ゲストとしてカートに追加など)は、Hide prices until customer logs in を有効化していない場合は引き続き機能します。
B2B-only モードはクロームを制御するものであって、ゲートではありません。ゲストが価格を見たりチェックアウトしたりするのを防ぐには、Customize ▸ Theme settings ▸ B2B ▸ Hide prices until customer logs in で Hide prices until customer logs in も有効化してください。 この組み合わせが正規の 「真の卸売専用」 構成です。
モード 3 — B2C-only
B2C-only は最も強力な非表示モードです。UI のすべての B2B 要素は抑制されます — サインイン済みの B2B バイヤーにも。コバルトブルーのグリーティングバーは描画されません。営業担当ピルも描画されません。NET 条件バッジも描画されません。B2B 対応アカウントダッシュボードは B2C アカウントダッシュボードに戻ります。RFQ と一括注文リンクはナビゲーションから削除されます。
基となる ページは引き続き存在します — /pages/rfq、/pages/bulk-order、/pages/special-offers。それらは単にナビゲーションからリンクされていないだけです。ナビゲーションとクロームのみ が非表示になり、ページは直接 URL でアクセス可能なまま残ります。
B2C-only を使うべき人
- 同じ Vertex テーマを姉妹 B2C ストアで動作させており、そこでは B2B 活動がまったくない場合(例: 小売専用の消費者ブランド vs 工業用品ブランド)。同じテーマ、異なるストア。
- B2B 機能をソフトローンチ中 — 早期の訪問者に UI を公開 せずに、バックグラウンドで会社、カタログ、支払い条件、テーマ設定を構成したい。ローンチ日に Hybrid(または B2B-only)に切り替えます。
- ローンチランプ中の純小売期間 — 例: 一様に消費者向けの体験にしたいブラックフライデー週。
- すべてのページを一時的に B2C 向けにする必要がある規制または契約上のタイミング。
B2C-only の動作
- すべての B2B 要素を抑制します。ストアフロントは洗練された B2C 工業用品テーマのように見えます。
- サインイン済みの B2B バイヤーは引き続きカタログスコーピングを得ます(Shopify ネイティブ)が、B2B クロームはありません。カタログ価格は見えますが、NET 条件バッジ、営業担当ピル、ボリューム価格テーブルはありません。
- B2B 機能プロモストリップは全員から非表示になります。
- 一括注文、RFQ、特別オファーページは引き続き直接 URL でアクセス可能 — ナビゲーションリンクのみが非表示になります。
B2C-only を使うべきでない場合
- クローム内で NET 条件バッジ、営業担当の連絡先情報、ボリュ ーム価格を見ることに依存しているサインイン済みの B2B バイヤーがいる場合。それらすべてを失います。
- 卸売専用マーチャントの場合 — 代わりに B2B-only を使用してください。
一般的なランプアップパターン: 「B2B を 30 日間でソフトローンチ」
初めて B2B を採用するマーチャントに人気のパターンです:
- 1〜14 日目: B2C-only モード。 Vertex をインストール。B2B セットアップガイドに従って管理画面でネイティブ B2B を構成。会社、カタログ、価格リスト、支払い条件を作成。メタフィールドセットアップガイドに従って営業担当と商品仕様のメタフィールドを入力。スタッフアカウントで内部テスト。顧客にはまだ何も公開されていません。
- 15〜25 日目: Hybrid モード。ただし B2B バイヤーにはまだ公開しない。 Hybrid に切り替え。3〜5 のパイロット取引アカウントをオンボード。すべてが正しく描画されることを確認。設定を反復改善。営業担当の割り当てを精緻化。
- 26 日目以降: Hybrid のまま、公開アナウンス。 小売リストにメールして取引アカウント申請を招待。ホームページヒーローに RFQ リンクを追加。これでライブです。
卸売専用マーチャントの場合は、ステップ 3 を 「B2B-only に切り替え」 に置き換えて、Hide prices until customer logs in をオンにします。
Storefront mode は単一のテーマ設定です。変更しても、保存データ、顧客アカウント、B2B 会社、カタログ、注文への影響はゼロです — どの UI 要素が描画されるかが変わるだけです。ビジネスの進化に合わせて何度でも切り替えられます。
Storefront mode の変更方法
- Shopify 管理画面を開き、Online Store ▸ Themes に移動します。
- Vertex テーマ(Live または任意のプレビューテーマ)を見つけます。
- Customize をクリックします。
- テーマエディタの左上隅で、Theme settings アイコン(セクションリストの下にある小さな歯車)をクリックします。
- B2B グループまでスクロール(またはクリック)します。
- Storefront mode を見つけます。
- Hybrid、B2B-only、B2C-only のいずれかを選択します。
- (右上の)Save をクリックします。
クリックパス: Online Store ▸ Themes ▸ Customize ▸ Theme settings ▸ B2B ▸ Storefront mode ▸ Save
変更は即座に適用されます — 別のタブでストアフロントを更新して確認してください。
ディシジョンツリー
どのモードを選ぶか分からない? このツリーを歩いてください:
-
小売顧客に販売しますか?
- はい → 質問 2 に進みます。
- いいえ(卸売専用) → B2B-only を選択。Hide prices until customer logs in も有効化します。
-
現在、サインイン済みの B2B バイヤーがいますか?
- いいえ(まだ) → バックグラウンドで B2B を構成する間 B2C-only を選択。準備ができたら Hybrid に切り替えます。
- はい → Hybrid を選択。以上です。
-
ゲスト向けに B2B 風のサインアップファネルが欲しいですか?
- はい → B2B-only(Hide prices until customer logs in 付き)を検討します。
- いいえ、サインアップは B2C 風にしたい → Hybrid のままにします。
FAQ
モード変更で何かが壊れますか?
いいえ。Storefront mode 設定は、どの UI 要素が描画されるかを変更するだけです。保存データ、顧客アカウント、B2B 会社、カタログ、価格リスト、支払い条件、注文履歴はすべて手付かずです。
B2C-only モードは /pages/rfq と /pages/bulk-order ページを非表示にしますか?
いいえ。ページは公開され、直接 URL でアクセス可能なまま残ります。ナビゲーションリンクと B2B UI のみが非表示になります。URL を知っているマーチャントや顧客は引き続き訪問できます。
コレクション別または商品別に B2B 要素を条件付きで描画できますか?
Storefront mode はサイト全体のトグルです。コレクション別または商品別の非表示には、Shopify 管理画面でカタログスコーピングを使用してください。例えば、カタログから除外された商品は、その B2B バイヤーのストアフロントにはまったく表示されません。
モードが B2C-only のときに B2B バイヤーがサインインするとどうなりますか?
バイヤーはサインインし、カタログスコーピングが適用されます(カタログの商品のみが見える)が、B2B クロームは何も描画されません。彼らには B2C 顧客と同じようにストアフロントが見えます。NET 条件バッジ、営業担当ピル、ボリューム価格テーブル、グリーティングバーはすべて抑制されま す。
モード別の文字列をローカライズできますか?
はい。Vertex のすべての文字列は Theme settings ▸ Languages で翻訳可能です。「取引アカウントを作成」と「サインアップ」のラベルは、ブランドボイスに合わせて言語別にカスタマイズできます。
次のステップ
- B2B セットアップガイド → — B2C-only モードから切り替える前に、ネイティブ B2B をエンドツーエンドで有効化します。
- メタフィールドセットアップガイド → — 営業担当カード、仕様テーブル、Documents ブロックを駆動する
vertexメタフィールドを入力します — Hybrid と B2B-only モードで実際に描画されるように。 - テーマ設定リファレンス → — テーマエディタのその他すべての B2B 関連設定(Storefront mode、Hide prices until customer logs in、そして商品ページのトグル)。
- FAQ + トラブルシューティング → — モード関連のよくある質問への回答。