WordPressのお問い合わせをKantanBizの「案件」に取り込む方法(Contact Form 7 × Webhook)

会社サイトの「お問い合わせフォーム」から届いた内容を、メールだけでなくKantanBiz上の案件(受付中)として残したい——そんなときの設定の流れです。


できるようになること

  • 訪問者が WordPress のフォーム(例:Contact Form 7)を送信する
  • フォーム用に入れた Webhook プラグインが、KantanBiz の専用アドレスへ内容を送る
  • KantanBiz では、いま選んでいるオフィスに、顧客と案件が自動で登録される

事前に準備するもの

  • KantanBiz(**https://kantanbiz.cloud**)の**オーナー権限**でログインできること
  • WordPress 側で Contact Form 7 が使えること
  • フォーム送信後に外部URLへデータを送れるプラグイン(後述の「Webhook プラグインの例」)を入れられること

シンプルなお問い合わせフォーム(CF7)

フォームタブに、例えば次を貼り付けます。

<label> 会社名(任意)
    [text* your-company-name] </label>

<label> お名前
    [text* your-name] </label>

<label> メールアドレス
    [email* your-email] </label>

<label> 件名
    [text* your-subject] </label>

<label> お問い合わせ内容
    [textarea* your-message] </label>

[submit "送信"]

手順1:KantanBiz で「送り先」と「鍵」を用意する

  1. ブラウザで https://kantanbiz.cloud を開き、ログインする
  2. 画面上部の 設定 を開く
  3. 問い合わせ受信(CF7) を開く※ メニューに出ない場合は、オーナーではない、またはプラン条件の可能性があります。
  4. 画面に表示される 送信先URL をメモする(後で WordPress に貼る)
  5. トークンを発行ボタンから鍵を発行し、表示された長い文字列をコピーして安全な場所に保管する

重要: トークンはこの画面でしか再表示できません。メモ忘れに注意してください。

画面上で選んでいるオフィスがそのまま対象です。

送り先と鍵のイメージ

  • 送信先URL(固定)
    https://kantanbiz.cloud/api/v1/inbound/contact-form
  • 鍵の使い方(WordPress プラグイン側で設定)
    • ヘッダー Authorization に
      Bearer (スペース)(コピーしたトークン)
    • または、プラグインが対応していれば
      ヘッダー X-KantanBiz-Contact-Token にトークンだけ

手順2:WordPress でフォームと Webhook をつなぐ

1)Contact Form 7 でフォームを用意する

いつもどおり、名前・メール・件名・本文などのフィールドを用意します。

2)Webhook 用プラグインを入れる

「フォームが送られたあと、指定したURLにPOSTする」機能があるものを選びます。

例としてよく挙げられるプラグイン(参考)

  • CF7 to Webhook 系
  • Kainoto Webhook for Contact Form 7
  • RT Webhook for Contact Form 7

ほか、WP Webhooks のような汎用型や、Make / Zapier で「フォーム → 中継 → KantanBiz」の2段にする方法もあります。

3)プラグインに次を設定する

  1. 送信先URL … **https://kantanbiz.cloud/api/v1/inbound/contact-form**(末尾までそのまま)
  2. 認証ヘッダー … 上記の Authorization または X-KantanBiz-Contact-Token
  3. 送るデータ … JSON で送れる場合、posted_data にフィールド一式が入る形だと扱いやすいです

CF7 to Webhook での設定例

前提: プラグインを 最新版にしておく(カスタムヘッダーは 2.3.0 以降)。Contact Form 7 で対象フォームを開き、Webhook/連携のタブで URL とヘッダーを設定します。

項目設定例
送信先 URLhttps://kantanbiz.cloud/api/v1/inbound/contact-form
ヘッダー名Authorization
ヘッダー値Bearer の直後に 半角スペース 1 つ、続けて 発行したトークン全文(例: Bearer kbiz_cf_…

別パターン(Bearer を使わないとき):
名前 X-KantanBiz-Contact-Token、値は トークンだけ(Bearer なし)。

JSON でヘッダーを書く画面の場合の例:

{“Authorization”:”Bearer kbiz_cf_(あなたのトークン)”}

画面が「1行1ヘッダー」のときは次の1行でも可です。

Authorization: Bearer kbiz_cf_(あなたのトークン)

トークンは KantanBiz の 設定 → 問い合わせ受信(CF7) で発行し、再表示できない前提でコピーして保存してください。

カスタムBody(J SON形式)を追加

上記コンタクトフォームの場合

{
  "your-name": "[your-name]",
  "your-email": "[your-email]",
  "your-subject": "[your-subject]",
  "your-message": "[your-message]",
  "your_company_name": "[your_company_name]"
}

Bodyを確認する

項目の置換が失敗しているとKantanBizにデータが入らない場合がありますので、CF7 to WebhookプラグインのBodyを確認してください。

設定後、テスト送信をして、KantanBiz(**https://kantanbiz.cloud**)の 案件一覧に「受付中」が増えたか確認します。


うまくいかないとき(オーナーが確認するとよいこと)

  • トークンを貼り間違えていないか(前後のスペース、Bearer の付け忘れ)
  • 送信先URLが https://kantanbiz.cloud/api/v1/inbound/contact-form と完全一致しているか
  • 古いトークンを消して新しく発行したのに、WordPress 側が古い鍵のままになっていないか

セキュリティの注意

  • トークンはパスワードと同様に扱い、ブログやSNS、スクリーンショットに載せない
  • 漏れた心配があるときは、KantanBiz でトークンを削除して再発行し、WordPress 側も新しい鍵に更新する

まとめ

オーナーがやることは次の2つです。

  1. https://kantanbiz.cloud の「問い合わせ受信(CF7)」でURLとトークンを用意する
  2. WordPressでCF7 + Webhookプラグインを使い、https://kantanbiz.cloud/api/v1/inbound/contact-form と同じ認証に合わせる

まずはテスト送信で一件通れば、その後は通常運用で問い合わせが案件として溜まっていきます。


コメント

タイトルとURLをコピーしました