> ## Documentation Index > Fetch the complete documentation index at: https://docs.utage-system.com/llms.txt > Use this file to discover all available pages before exploring further. # 登録フォームを作成する > メルマガ登録やリード獲得用のフォーム付きLPを作成する このガイドでは、メルマガ登録フォーム付きのLPを作成する手順を説明します。フォーム登録と同時にステップメール配信を開始する構成です。 ## 全体の流れ 1. 配信アカウントを作成 2. シナリオを作成 3. ファネル・ステップを作成 4. フォーム付きLPページを作成 5. サンクスページを作成 ## 1. 配信アカウントを作成 フォーム登録先となる配信アカウントを作成します。 ```bash theme={null} curl -X POST "https://api.utage-system.com/v1/accounts" \ -H "Authorization: Bearer YOUR_API_KEY" \ -H "Content-Type: application/json" \ -d '{ "name": "メルマガ配信", "type": "mail" }' ``` ```json レスポンス theme={null} { "data": { "id": "ac_abc123", "name": "メルマガ配信", "type": "mail" } } ``` `type` にはメール配信なら `mail`、LINE配信なら `line`、両方なら `mail_line` を指定します。 ## 2. シナリオを作成 配信アカウント内にシナリオを作成します。シナリオはステップメール等の配信シーケンスを管理する単位です。 ```bash theme={null} curl -X POST "https://api.utage-system.com/v1/accounts/ac_abc123/scenarios" \ -H "Authorization: Bearer YOUR_API_KEY" \ -H "Content-Type: application/json" \ -d '{ "title": "無料メール講座" }' ``` ```json レスポンス theme={null} { "data": { "id": "sc_def456", "title": "無料メール講座", "open_title": null, "created_at": "2026-01-01 10:00:00" } } ``` ## 3. ファネル・ステップを作成 LP用とサンクスページ用の2つのステップを含むファネルを作成します。 ```bash theme={null} # ファネル作成 curl -X POST "https://api.utage-system.com/v1/funnels" \ -H "Authorization: Bearer YOUR_API_KEY" \ -H "Content-Type: application/json" \ -d '{"name": "メルマガ登録ファネル"}' ``` ```json レスポンス theme={null} { "data": { "id": "fn_abc123", "name": "メルマガ登録ファネル" } } ``` ```bash theme={null} # LP用ステップ作成 curl -X POST "https://api.utage-system.com/v1/funnels/fn_abc123/steps" \ -H "Authorization: Bearer YOUR_API_KEY" \ -H "Content-Type: application/json" \ -d '{"name": "登録ページ"}' ``` ```json レスポンス theme={null} { "data": { "id": "st_step01", "name": "登録ページ", "order": 1 } } ``` ```bash theme={null} # サンクスページ用ステップ作成 curl -X POST "https://api.utage-system.com/v1/funnels/fn_abc123/steps" \ -H "Authorization: Bearer YOUR_API_KEY" \ -H "Content-Type: application/json" \ -d '{"name": "サンクスページ"}' ``` ```json レスポンス theme={null} { "data": { "id": "st_step02", "name": "サンクスページ", "order": 2 } } ``` ## 4. フォーム付きLPページを作成 フォーム要素を含むページを作成します。フォーム要素は `element_types_funnel?include=form` で取得できる特殊な要素です。 ### フォーム要素タイプの確認 ```bash theme={null} curl -X GET "https://api.utage-system.com/v1/element-types/funnel?include=form" \ -H "Authorization: Bearer YOUR_API_KEY" \ -H "Content-Type: application/json" ``` ### フォーム要素の階層構造 フォーム要素は通常の要素と異なり、内部に子要素を持つ特殊な構造です。 ``` section > row > col > form ├── form-input （item=name: お名前入力欄） ├── form-input （item=mail: メールアドレス入力欄） └── form-button （送信ボタン） ``` form要素には `scenario_id` の指定が必須です。未指定の場合、フォーム登録が正しく動作しません。 ### ページ作成 ヘッダーテキスト + フォームの構成でLPを作成します。 ```bash theme={null} curl -X POST "https://api.utage-system.com/v1/funnels/fn_abc123/steps/st_step01/pages" \ -H "Authorization: Bearer YOUR_API_KEY" \ -H "Content-Type: application/json" \ -d '{ "title": "メルマガ登録LP", "page_title": "無料メール講座｜3日間で学ぶマーケティング入門", "pc_width": 800, "elements": [ { "type": "section", "background_color": "#1a1a2e", "padding_top": 60, "padding_bottom": 60, "children": [ { "type": "row", "children": [ { "type": "col", "children": [ { "type": "text", "content": "

無料メール講座

3日間で学ぶマーケティング入門

" } ] } ] } ] }, { "type": "section", "padding_top": 40, "padding_bottom": 40, "children": [ { "type": "row", "children": [ { "type": "col", "children": [ { "type": "text", "content": "

今すぐ無料で受講する

メールアドレスを入力して登録ボタンを押してください

" } ] } ] } ] }, { "type": "section", "padding_top": 20, "padding_bottom": 60, "children": [ { "type": "row", "children": [ { "type": "col", "children": [ { "type": "form", "scenario_id": "sc_def456", "children": [ { "type": "form-input", "item": "name", "input_type": "text", "label": "お名前", "required": 1 }, { "type": "form-input", "item": "mail", "input_type": "email", "label": "メールアドレス", "required": 1 }, { "type": "form-button", "action": "form", "content": "無料で受講する", "button_color": "btn-red" } ] } ] } ] } ] } ] }' ``` ```json レスポンス theme={null} { "data": { "id": "pg_form01", "title": "メルマガ登録LP", "content_type": "elements", "pc_width": 800, "step_url": "https://utage-system.com/p/xxxxx/", "page_url": "https://utage-system.com/page/pg_form01" } } ``` ### form要素の主要プロパティ | プロパティ | 説明 | | ------------- | ---------------------------------- | | `scenario_id` | 登録先シナリオのID（必須） | | `children` | フォーム内の子要素（form-input, form-button） | ### form子要素の種類 | 要素タイプ | 説明 | | ------------- | ----------------------------------------------------------------------------------------------------------------------------------------------- | | `form-input` | フォーム入力欄。`item`（`name` / `mail` / `phone` / `kana` / `zipcode` 等）と `input_type`（`text` / `email` / `tel` 等）で入力項目を指定。`label`・`required`（0/1）等も指定可 | | `form-button` | フォーム送信ボタン。`action`（必須、`form`）と `content`（ボタンテキスト）、`button_color`（テーマ。`btn-red` / `btn-green` 等）を指定 | フォームの子要素タイプと利用可能なプロパティの詳細は、[要素プロパティAPI](/api-reference/funnel/element-properties)で `types=form,form-input,form-button` を指定して取得できます。 ## 5. サンクスページを作成 フォーム登録後に表示されるサンクスページを、次のステップとして作成します。 ```bash theme={null} curl -X POST "https://api.utage-system.com/v1/funnels/fn_abc123/steps/st_step02/pages" \ -H "Authorization: Bearer YOUR_API_KEY" \ -H "Content-Type: application/json" \ -d '{ "title": "サンクスページ", "page_title": "ご登録ありがとうございます", "pc_width": 800, "elements": [ { "type": "section", "padding_top": 80, "padding_bottom": 80, "children": [ { "type": "row", "children": [ { "type": "col", "children": [ { "type": "text", "content": "

ご登録ありがとうございます

ご入力いただいたメールアドレスに確認メールをお送りしました。
メールに記載の手順に従って受講を開始してください。

" } ] } ] } ] } ] }' ``` ```json レスポンス theme={null} { "data": { "id": "pg_thanks01", "title": "サンクスページ", "content_type": "elements", "pc_width": 800, "step_url": "https://utage-system.com/p/yyyyy/", "page_url": "https://utage-system.com/page/pg_thanks01" } } ``` ## 完成したファネル構造 ``` メルマガ登録ファネル (fn_abc123) ├── 登録ページ (st_step01) │ └── メルマガ登録LP (pg_form01) ← フォーム付き └── サンクスページ (st_step02) └── サンクスページ (pg_thanks01) ``` 登録ページの `step_url` にアクセスすると、フォーム付きLPが表示されます。フォームからの登録完了後、シナリオ「無料メール講座」の配信が開始されます。 ## 次のステップ エラーの種類と対処方法 全エンドポイントの詳細仕様