B2B セットアップガイド — Vertex で Shopify ネイティブ B2B を有効化
このガイドでは、Shopify のネイティブ B2B を有効化する手順を順を追って説明します。これにより、Vertex テーマは数量割引テーブル、数量ルールの強制、NET 支払い条件、税免除バッジ、複数拠点の会社切り替え、B2B カタログ、営業担当連絡カード、その他すべての標準 B2B 機能をレンダリングできるようになります。
コンパニオンアプリ不要。月額サブスクリプション不要。サードパーティスクリプト不要。 Vertex がレンダリングするすべての B2B オブジェクトは、Shopify がすでに公開している Liquid ドロップのみを使用して、Shopify のネイティブ B2B オブジェクト — customer.b2b?、customer.current_company、variant.quantity_price_breaks、variant.quantity_rule、customer.company_available_locations — から直接取得されます。
このガイド全体をスキップしても、Vertex は洗練された B2C 産業用品テーマとして動作します。ログイン中の会社がない場合、すべての B2B 要素は自動的に非表示になります。テーマを再インストールすることなく、後から B2B を有効化できます。
なぜネイティブ B2B(アプリではなく)を選ぶのか
ほとんどの「B2B Shopify テーマ」は有料アプリのスタック — 卸売価格アプリ、アカウントロックアプリ、NET 条件アプリ、見積管理アプリ、顧客グループアプリ — に依存しています。それぞれが月額料金、追加の Liquid ブロック、レンダリングをブロックするスクリプト、そして毎年再交渉が必要なベンダーを追加します。
Vertex は反対のアプローチを取ります。 Shopify は 2023 年に完全なネイティブ B2B 機能セット(Companies、Catalogs、Volume pricing、Quantity rules、Payment terms、Tax exemption)を出荷しました。Vertex は初日からこれらのネイティブオブジェクトを美しくレンダリングするために構築されました — ラッパーなし、アプリ依存なし、Shopify が次の四半期に新しい B2B 機能を出荷しても書き直し不要です。
| アプリで支払う対象 | Vertex がネイティブ B2B で実現すること |
|---|---|
| 卸売価格アプリ($29〜99/月) | Shopify Catalog 価格リスト — 無料、ネイティブ |
| 数量割引アプリ($19〜49/月) | variant.quantity_price_breaks — 無料、ネイティブ |
| Net 条件アプリ($29〜79/月) | 会社レベルの支払い条件 — 無料、ネイティブ |
| 見積管理アプリ($19〜59/月) | /pages/rfq テンプレート — Vertex に組み込み |
| 卸売ロックアプリ($14〜39/月) | ログイン必須の価格表示 テーマ設定 — Vertex に組み込み |
| マルチロケーションアプリ($29〜99/月) | customer.company_available_locations — 無料、ネイティブ |
| 推定年間節約額 | ストアあたり $1,800〜$4,800/年 |
前提条件
開始する前に、以下を確認してください。
- Shopify プランがネイティブ B2B をサポートしている。 つまり、Shopify Plus、または B2B アドオンが有効化された Shopify Advanced です。ネイティブ B2B は Basic / Shopify / スタータープランでは利用できません。
- 管理者アクセスが Shopify 管理画面の Settings、Customers、Products、Themes にある。
- Vertex がインストール済みで公開されている(またはプレビューテーマとしてインストールされている)。初回インストールについては インストールガイド を参照してください。
- 新しい顧客アカウントが有効化されている。 B2B には新しいアカウント(パスワードレス)が必要で、レガシーのクラシックアカウントではありません。
下位プランの場合でも、Vertex をインストールして今日から B2C 専用の産業用品テーマとして運用できます。プランがアップグレードされると、以下に記載されているすべての B2B 機能がテーマ作業ゼロでアクティブ化されます。このページにまた戻ってください。
セットアップする内容
| ステップ | 管理画面の場所 | 理由 |
|---|---|---|
| 1. ネイティブ B2B を有効化 | Settings ▸ Customer accounts ▸ B2B ▸ Manage | Companies + Catalogs をアンロック |
| 2. 最初の会社を作成 | Customers ▸ Companies ▸ Add company | 主要な B2B オブジェクト |
| 3. 会社の拠点を追加 | 会社ページ ▸ Locations | 複数拠点の ship-to 切り替えを駆動 |
| 4. バイヤーアカウントを追加 | 会社ページ ▸ Customers | location-admin またはバイヤーロールを割り当て |
| 5. B2B カタログを作成 | Products ▸ Catalogs ▸ Add catalog | B2B 価格 + 数量ルールのコンテナ |
| 6. 数量階層付きの価格リストを追加 | カタログページ ▸ Price list | PDP の数量割引テーブルを駆動 |
| 7. カタロ グを会社に割り当て | カタログページ ▸ Customers | 価格をバイヤーに接続 |
| 8. 支払い条件を設定(NET-30 など) | 会社ページ ▸ Payment terms | NET 条件バッジを駆動 |
| 9. (オプション)会社を税免除にマーク | 会社ページ ▸ Tax settings | 税免除バッジを駆動 |
10. (オプション)vertex.rep_* メタフィールドを追加 | 会社ページ ▸ Metafields | 営業担当連絡ピルを駆動 |
| 11. ログイン中のバイヤーとしてテスト | シークレットモードのストアフロント | すべての B2B 要素のレンダリングを検証 |
ステップ 1 — ネイティブ B2B を有効化
- Shopify 管理画面から、Settings(左下)をクリック。
- 左サイドバーで、Customer accounts をクリック。
- New customer accounts が選択されていることを確認。B2B はレガシークラシック顧客アカウントでは動作しません。
- B2B セクションまでスクロール。
- Manage をクリック。
- Enable B2B をクリック。
- 確認プロンプトに応じます。
クリックパス: Settings ▸ Customer accounts ▸ B2B ▸ Manage ▸ Enable B2B
有効化されると、2 つの新しい管理項目が表示されます。
- メインナビの Customers の下に Companies
- メインナビの Products の下に Catalogs
B2B アドオンを使用した Shopify Advanced では、有効化後に Companies と Catalogs のナビ項目が表示されるまで 2〜5 分かかることがあります。すぐに表示されない場合は、管理画面のページを更新してください。
ステップ 2 — 最初の会社を作成
Shopify B2B における 会社(company) は、注文を行い、支払い条件を保持し、1 つ以上の拠点を含む法人エンティティ — 単一のバイヤー組織 — を表します。
- 管理画面のサイドバーから、Customers ▸ Companies に移動。
- Add company(右上)をクリック。
- Company details を入力:
- Company name — バイヤー組織の正式名または取引名。例: Northgate Facilities LLC。
- External ID(オプション) — 内部のアカウント番号を保持している場合。
- Note(オプション) — 内部的に記録したい内容(アカウントマネージャーの引き継ぎメモ、契約参照番号など)。
- Main contact を入力 — これは主要なバイヤーの名前とメールアドレスです。彼らはこのメールでサインインします。
- Save をクリック。
クリックパス: Customers ▸ Companies ▸ Add company ▸ Save
Shopify は自動的に会社とその最初の拠点を作成します。
ステップ 3 — 会社の拠点を追加
各 拠点(location) は、会社に属する 1 つの ship-to 住所です。バイヤーの組織に複数の地域オフィス、 倉庫、または店舗がある場合、それぞれを個別の拠点として追加します。バイヤーは、コバルトブルーの B2B グリーティングバー内の Vertex の ship-to 拠点切り替え を使用して、ストアフロントでそれらを切り替えることができます。
- 会社ページ(先ほど作成したもの)から、Locations セクションまでスクロール。
- Add location をクリック。
- 以下を入力:
- Location name — 例: Cleveland Distribution Center。
- Shipping address — 完全な住所。
- Billing address — デフォルトでは配送先と同じ。トグルして別の請求先住所を入力できます。
- 保存。
- 追加の拠点ごとに繰り返します。
クリックパス: 会社ページ ▸ Locations ▸ Add location ▸ Save
単一拠点の会社でも問題ありません。ship-to 切り替えは、バイヤーが 2 つ以上の拠点を持つ場合にのみ Vertex でレンダリングされます。1 拠点の場合、バイヤーのデフォルト ship-to がどこでも静かに使用されます。
バイヤーが Vertex の切り替え(デスクトップヘッダーのコバルトブルーの グリーティングバー、またはモバイルドロワーのアカウントセクション)を使用して拠点を切り替えると、Shopify はカートを再利用しますが、ship-to 住所、税コンテキスト、価格リストのスコープを更新します。
ステップ 4 — バイヤーアカウントを追加(ロールを割り当て)
この会社の B2B バイヤーとしてサインインすべきすべての顧客は、その会社の拠点のいずれかにリンクされる必要があります。
- 会社ページから、Customers までスクロール(または会社のタブナビで Customers をクリック)。
- Add customer をクリック。
- メールで既存の顧客を検索するか、Create new customer をクリックしてインラインで追加します。
- 彼らが属する 拠点 を選択します(ステップ 3 で作成した拠点の 1 つ)。
- ロール を選択:
- Location admin — 拠点のアドレス帳を管理し、同じ拠点の他のバイヤーを確認し、注文を行うことができます。バイヤーの調達リード向けに最適。
- Ordering only — 注文のみ可能。会社プロファイルを変更すべきでない個々のバイヤー向けに最適。
- Save をクリック。
クリックパス: 会社ページ ▸ Customers ▸ Add customer ▸ 拠点を選択 ▸ ロールを選択 ▸ Save
そのバイヤーは通常の顧客ログイン(メール + マジックリンクまたはパスワード)でサインインでき、Vertex は customer.b2b? Liquid ドロップを介してそれらを B2B バイヤーとして認識します。コバルトブルーのグリーティングバーが会社名とともに表示され、割り当てられたカタログが適用され、B2B 対応のアカウントダッシュボードがレンダリングされ、(メタフィールドが設定されている場合は)REP ピルがヘッダーに表示されます。
ステップ 5 — B2B カタログを作成
カタログ(catalog) は、価格に関するすべての B2B 固有のもの — どの製品が会社に公開されるか、彼らが支払う価格、適用される数量階層、各バリアントに強制される数量ルール(MOQ、最大、増分) — のための Shopify のネイティブコンテナです。
- 管理画面のサイドバーから、Products ▸ Catalogs に移動。
- Add catalog(右上)をクリック。
- B2B catalog(Markets catalog ではない)を選択。
- 以下を入力:
- Catalog name — 内部ラベル。例: Contract Tier B — Distributors。
- Products — このカタログが 公開する製品を選択します。ストア全体、スマートコレクション、または手動で選択したリストを含めることができます。
- Save をクリック。
クリックパス: Products ▸ Catalogs ▸ Add catalog ▸ B2B catalog ▸ Save
ステップ 6 — 数量階層付きの価格リストを追加
次に、カタログに 価格リスト(price list) を添付します。これは、PDP の数量割引テーブルを駆動する数量階層を含む、バイヤーが支払う実際の B2B 価格を定義するものです。
- カタログページから、Add price list(または Price list ▸ Manage)をクリック。
- 戦略を選択:
- Percentage discount off all products — 例: カタログ全体で小売価格から 15% オフ。
- Fixed prices per product/variant — 明示的な B2B 価格、小売価格を無視。
- Mixed — パーセンテージをデフォルトとし、特定の製品にオーバーライド。
- 数量割引階層 については、各製品/バリアントを編集し、数量ブレイク行を追 加します。12 個パックの商品の例:
| 数量 | 単価 |
|---|---|
| 1+ | $14.50 |
| 12+ | $13.80(5% オフ) |
| 48+ | $13.05(10% オフ) |
| 144+ | $12.32(15% オフ) |
これらの階層は variant.quantity_price_breaks を介して Vertex に公開され、PDP の Add to cart ボタンのすぐ上に Volume pricing テーブルとしてレンダリングされ、カートの各行および一括注文ページに階層インジケーターとしてもレンダリングされます。
-
数量ルール については、製品/バリアントごとに設定:
- Minimum — MOQ(例: 12)。
- Maximum — 注文ごとの上限(例: 1,440)。
- Increment — ケースパックステップ(例: 12)。
Vertex はこれらを PDP の数量ステッパー、すべてのカート行、一括注文ページ(
/pages/bulk-order)でクライアント側で強制します。無効な数量は Add to cart を無効にし、"Order in increments of 12. Try 24 or 36." のようなインラインメッセージを表示します。 -
保存。
よくある落とし穴: 数量割引は カタログの 価格リスト内で設定する必要があります。Products ▸ Pricing で製品自体に数量割引を設定しても B2B には引き継がれません。常にカタログページから数量階層を編集してください。
ステップ 7 — カタログを会社に割り当て
カタログは作成されましたが、まだバイヤーに接続されていません。割り当てましょう。
- カタログページから、Customers までスクロール。
- Add customers をクリック。
- ステップ 2 で作成した会社を検索。
- Add をクリック。
- 保存。
クリックパス: カタログページ ▸ Customers ▸ Add customers ▸ 会社を選択 ▸ Add
これで、その会社としてサインインしているバイヤーには以下が表示されます:
- カタログに含まれる製品のみ(その他は一覧から非表示になり、直接訪問した場合は 404)。
- カタログ価格(小売価格ではない)。
- どこでも強制される数量階層と数量ルール。
ステップ 8 — 支払い条件を設定(NET-30 / NET-60 / NET-90)
会社に繰り延べ支払い条件 — NET-30、NET-60、NET-90、固定日付など — がある場合、会社レベルで設定します。Vertex はこれを自動検出し、コバルトブルーのグリーティングバーとカートに NET terms バッジをレンダリングします。
- 会社ページに戻る(Customers ▸ Companies ▸ [company])。
- Payment terms までスクロール。
- Set up payment terms をクリック。
- テンプレートを選択:
- Receipt — 注文時に支払い期限(小売のデフォルト)。
- Net 7 / 15 / 30 / 45 / 60 / 90 — 請求書発行から N 日後に支払い期限。
- Fixed date — 特定のカレンダー日に支払い期限。
- 保存。
クリックパス: 会社ページ ▸ Payment terms ▸ Set up payment terms ▸ テンプレートを選択 ▸ Save
Shopify は、この会社がカードチャージなしでチェックアウトすることを許可するようになります。バイヤー(およびあなたの AR チーム)は、すべてのステップで NET 条件を明確に確認できます。
バッジに "NET 30" だけでなく "NET 30 — Pay by invoice" と表示したい場合は、vertex.payment_terms 会社メタフィールドを介して文言をオーバーライドします。メタフィールドセットアップガイド を参照してください。
ステップ 9 — (オプション)会社を税免除にマーク
会社が税免除 — 再販証明書を持つ再販業者、政府バイヤー、適格な非営利団体 — の場合、会社レベルで税金請求をオフに切り替えます。Vertex は PDP、カート、アカウントダッシュボードに Tax exempt バッジを表示します。
- 会社ページから、Tax settings までスクロール。
- Charge taxes を off に切り替えます。
- (推奨)バイヤーの税免除証明書をノート添付ファイルとしてアップロードします。
- 保存 。
クリックパス: 会社ページ ▸ Tax settings ▸ Charge taxes: off ▸ Save
Shopify は、この会社が行うすべての注文で税計算をスキップします。Vertex はバイヤーが一目で正しく免除されていることを確認できるようにバッジも表示します。
ステップ 10 — (オプション)営業担当メタフィールドを追加
各会社に指名された営業担当 / アカウントマネージャーを割り当てる場合、Vertex はデスクトップヘッダー(≥1170px)にスティッキー REP ピル を、モバイルドロワー(<1170px)の下部にフル幅のカードを、その担当者への mailto: と tel: を直接含めてレンダリングできます。
データは vertex ネームスペースの 3 つの会社レベルメタフィールドに存在します:
vertex.rep_name— テキスト — 例: "Sarah Chen"vertex.rep_email— テキスト(検証: email) — 例: "[email protected]"vertex.rep_phone— テキスト — 例: "+1-555-0142"
完全なセットアップは メタフィールドセットアップガイド にあります。 メタフィールド定義が Companies の Custom Data として存在するようになったら、各会社の Customers ▸ Companies ▸ [name] ▸ Metafields に入力します。
担当者メタフィールドを設定しない場合、REP ピルは単にレンダリングされません — エラーなし、レイアウト破損なし、プレースホルダーなし。カードはそこにありません。
ステップ 11 — バイヤーエクスペリエンスをテスト
ストアフロントを シークレットウィンドウ(マーチャントとしてサインインしていない状態)で開き、ステップ 4 で追加したバイヤーとしてサインインします。この検証チェックリストを実行します:
- コバルトブルーの B2B グリーティングバー がヘッダーの上に 表示され、会社名、NET 条件バッジ(例: NET 30)、該当する場合は Tax exempt バッジが表示される。
- 会社に 2 つ以上の拠点がある場合、ship-to 切り替え がグリーティングバー(デスクトップ)とモバイルドロワーにレンダリングされる。
- (
vertex.rep_*メタフィールドが設定されている場合)営業担当ピル がデスクトップヘッダーの右クラスターに表示される。 - PDP に数量割引テーブルが表示される Add to cart の上に、ステップ 6 で設定した階層付きで。
- PDP 数量ステッパーが MOQ + 増分を強制する — MOQ 未満の数量を入力してみて、Add to cart がインラインメッセージで無効になることを確認。
- カートに NET-30 バッジが表示される 注文サマリー内。
- 一括注文ページ(
/pages/bulk-order) — paste-to-cart が数量ルールとカタログスコープを尊重する。 - アカウントダッシュボード(
/account)が会社情報、支払い条件、クイック再注文、担当者カードを表示する。 - カタログスコープ — カタログにない製品を URL で訪問してみる。404 になるか非表示になるはず。
よくある落とし穴 + 修正
何かがレンダリングされない場合、このリストを確認してください。
「コバルトブルーのグリーティングバーが表示されない」
- Storefront モードが B2C 専用に設定されている。 Customize ▸ Theme settings ▸ B2B ▸ Storefront mode を確認。Hybrid(推奨)または B2B-only に切り替えます。Storefront モードガイド を参照。
- バイヤーが実際には B2B ではない。 管理画面でバイヤーの顧客レコードを開き、会社にリンクされていることを確認。そうでない場合は、ステップ 4 をやり直します。
- バイヤーはサインインしているがページがキャッシュされていた。 ハードリフレッシュ(Cmd/Ctrl + Shift + R)。
「PDP に数量割引テーブルがレンダリングされない」
- 会社にカタログが割り当てられていない。 ステップ 7 をやり直します。
- 製品ではなくカタログに数量階層が設定されている。 数量割引はカタログごとであり、製品ごとではありません。カタログページから階層を編集します。
- 製品がカタログにない。 製品がカタログの製品リストに含まれていることを確認。
- ゲスト向けに価格が非表示になっている。 数量割引テーブルは価格と同じゲートに従います — Theme settings ▸ B2B ▸ Hide prices until customer logs in がオンの場合、バイヤーがサインインするまでテーブルは抑制されます。(別途の「数量割引テーブルを表示」トグルはありません — テーブルはバリアントに数量階層があれば自動的に表示されます。)
「MOQ が強制されない」
- 数量ルールが設定されていない。 カタログ ▸ バリアントを選択 ▸ Minimum / Maximum / Increment を設定。保存。
- ブラウザキャッシュ。 ルールを編集した後はハードリフレッシュ。
「NET-30 バッジが表示されない」
- 会社に支払い条件が設定されていない。 ステップ 8 をやり直します。
- バイヤーがサインインしていない。 バッジはサインインした B2B バイヤーにのみ表示されます — これは設計通りです。
「ヘッダーに担当者ピルがレンダリングされない」
- メタフィールドがまだ定義として存在しない。 メタフィールドセットアップガイド を参照。
- メタフィールドは存在するがこの特定の会社では入力されていない。 会社ページ ▸ Metafields を開き、
vertex.rep_name+vertex.rep_email/vertex.rep_phoneの少なくとも 1 つを入力します。 - ウィンドウ幅が 1170px 未満。 ピルは小さい画面ではモバイルドロワーのアカウントセクションに折りたたまれます — ドロワーを開いて下までスクロールします。
「税免除バッジが表示されない」
- 会社の Charge taxes がまだオン。 ステップ 9 をやり直します。
「バイヤーがカタログ価格ではなく小売価格を見られる」
- カタログが会社に割り当てられていない。 ステップ 7 をやり直します。
- カタログの価格リストが空。 カタログ ▸ Price list ▸ Manage。価格を追加します。
Vertex が各 B2B 機能をレンダリングする方法
構成後、各 B2B 機能が Vertex で表面化する場所は以下のとおりです:
| 機能 | レンダリング場所 | テーマ設定 |
|---|---|---|
| コバルトブルーの B2B グリーティングバー | すべてのページのメインヘッダーの上(デスクトップ + モバイルドロワー) | 自動(サインイン済み B2B バイヤーに表示。B2C 専用モードでは非表示) |
| 会社名 + バッジ | グリーティングバー内 | 自動 |
| Ship-to 拠点切り替え | グリーティングバー(デスクトップ)+ ドロワー(モバイル) | 自動(会社が 2 つ以上の拠点を持つ場合に表示) |
| REP ピル | デスクトップヘッダー右クラスター + モバイルドロワーフッター | 自動(vertex.rep_* 会社メタフィールドが入力されている場合) |
| 数量割引テーブル | PDP、Add to cart の上 | 自動(バリアントに数量階層がある場合。Hide prices until customer logs in でゲート） |
| 数量ルールの強制 | PDP ステッパー + カート行 + 一括注文ページ | 自動 |
| NET 条件バッジ | グリーティングバー + カートサマリー + アカウントダッシュボード | 自動 |
| 税免除バッジ | グリーティングバー + カートサマリー + アカウントダッシュボード | 自動 |
| 一括注文ページ | /pages/bulk-order(page.bulk-order.json テンプレートを使用) | 自動 |
| RFQ ページ | /pages/rfq(page.rfq.json テンプレートを使用) | 自動 |
| B2B 対応アカウントダッシュボード | /account | 自動 |
| カタログスコープ(カタログ製品のみ表示) | コレクション、検索、PDP | Shopify ネイティブ |
設定ごとのドキュメントについては、テ ーマ設定リファレンス を参照してください。
次のステップ
- メタフィールドセットアップガイド → —
vertexメタフィールドネームスペース(データシート、MPN、営業担当連絡先、ships-from、技術仕様)を入力。 - Storefront モードガイド → — ビジネスに合った Hybrid / B2B-only / B2C-only モードを選択。
- テーマ設定リファレンス → — カスタマイザー内のすべての B2B 関連トグル。
- FAQ + トラブルシューティング → — 主要なバイヤー向け質問の回答。
- Shopify 公式ネイティブ B2B ドキュメント — help.shopify.com/manual/b2b