この記事でわかること
Jicoo の外部フォーム連携で、URL 解析では項目を取得できないケースがある理由
そうした場合に、Jicoo 側で項目を手動で追加する手順
HubSpot / Typeform / Tally など、主要プロバイダー別の field key の調べ方
なぜ自動検知できないことがあるのか
Jicoo の外部フォーム wizard は、指定された URL のページを読み取って form 項目を自動反映します。ただし次のようなケースでは自動検知ができません。
別ドメインの iframe で form が描画されている
HubSpot の従来 embed(hbspt.forms.create)や Typeform / Tally の embed など、提供元の別ドメインで form を表示するパターンです。ブラウザのセキュリティ制約により、埋め込みされた側のドメインから form の内容を読み取ることはできません。公開アクセスできない URL を指定している
ログインが必要なページ、プレビュー専用 URL、IP 制限のあるページは解析できません。公開された URL を指定してください。form の描画が遅すぎてタイムアウトした
JavaScript で遅延描画される form は、検知のタイムアウト(最大10秒)内に表示が完了しないと読み取れません。
いずれのケースでも、以下の手順で手動入力すれば Jicoo の外部フォーム routing(予約ページポップアップ / リダイレクト / サンクスページ)は問題なく利用できます。
手動で項目を追加する手順
1. 「項目を追加」ボタンを押す
項目定義セクションの下部にある 「項目を追加」 を押すと、空の項目カードが追加されます。
2. 表示ラベルを入力する
フォーム上の質問文(例: 「メールアドレス」「会社名」)を 表示ラベル に入れます。これは Jicoo 上での識別用なので、埋め込み元 form と完全一致でなくても構いません。
3. 項目タイプを選ぶ
次のいずれかから、元 form の挙動に合うものを選びます。
テキスト
複数行テキスト
メールアドレス
名前
電話番号
住所
単一選択(ラジオボタン)
複数選択(チェックボックス)
プルダウン
4. データの取り込み条件を設定する
Jicoo が埋め込み元 form から値を受け取るための識別情報を設定します。
HTML 属性のキー: 元 form の
<input>を識別する属性の種別。通常はnameを選びます。idで管理されている form もあるので、対象 input の HTML を確認してください。値: 上で選んだ属性の実際の値。たとえば元 form が
<input name="email">ならemailと入力します。
5. 選択式の項目は選択肢も入力する
単一選択 / 複数選択 / プルダウン を選んだ場合は、1 行に 1 つずつ選択肢の表示テキストを入れます。選択肢の内部値(value 文字列)とラベルの対応も設定可能です。
プロバイダー別のヒント
HubSpot forms
field の
name属性(firstname/lastname/email/company/phone/messageなど)を使います。該当する field の内部 name は、HubSpot の該当 form 編集画面 → 「Fields」タブで確認できます。
「HTML 属性のキー」は
nameを選択してください。
Typeform
field ごとの
nameが個別 hash になる場合があります。form の実ページを開き、ブラウザの開発ツールで<input name="...">を確認してください。
Tally / Fillout / Paperform
基本は
name="question_xxx"の形式です。同じく form の実ページで HTML を確認し、そのまま入力してください。
動作テスト
項目の保存が終わったら、次のステップで生成される埋め込みコードを form 設置ページの <head> に入れ、テスト送信してみてください。Jicoo 側で設定した routing(予約ページのポップアップ / リダイレクト / サンクスページ)が期待通りに動作すれば完了です。
それでも項目が取れない、または routing が動かない場合は Jicoo サポート までお気軽にお問い合わせください。
