Portfolioこのプロジェクトについて
Shopify + ヘッドレス構成のECサイトで、B2Bアカウント専用の自動割引システムと請求書払い機能を実装しました。
お客様がログインするだけで会員価格が自動表示され、決済時にはクーポンコードの入力なしで割引が適用されます。さらに、請求書払い（掛け売り）にも対応しています。
詳しく学ぶ
この仕組みについて、3つの記事で詳しく解説しています。
1
全体像と設計思想
なぜこの設計にしたのか、タグ名＝クーポン名の工夫、ヘッドレスならではの課題を解説します。
2
Shopify側の設定
顧客タグ、セグメント、コレクション、クーポンの設定手順を詳しく解説します。
3
ヘッドレス側の実装と請求書払い
タグ読み取り、価格計算、クーポン自動適用、ドラフトオーダーによる請求書払いを解説します。
仕組みの概要
Shopify管理画面の設定
顧客タグ → セグメント → クーポン
standard-35 → B2B Standard 35 → standard-35（35%OFF）
ポイント
タグ名 ＝ クーポン名（完全一致）
ヘッドレス（Next.js）での処理
ログイン
顧客認証
タグ取得
Storefront APIで取得
割引率算出
タグから算出
会員価格表示
自動表示
決済フロー
決済へ進む
カート確定
クーポン自動適用
タグ名と同名のクーポン
Shopify決済
割引適用済み
主な成果
- 運用効率: 新しいB2B顧客の追加はタグ付けだけで完了
- 顧客体験: ログインするだけで自動的に会員価格が適用
- 柔軟性: 複数カテゴリの異なる割引率にも対応
- コスト削減: Shopify Plus不要で本格的なB2B機能を実現
技術スタック
- Shopify Storefront API（顧客タグ取得）
- Shopify Admin API（ドラフトオーダー作成）
- Next.js（App Router）
- 顧客タグ・セグメント・クーポン連携