本記事はアフィリエイト広告を含みます。
formrunをWordPressへ埋め込む流れは、フォームを作る→設置先URLを登録→カスタムHTMLへコードを貼る→送信と通知を試すの四段階です。案内文とフォームを同じページに載せたいときに向きます。すぐ配布するだけなら、フォームURLを共有する方法も選べます。
formrunで作成したフォームは、それだけではWordPressの問い合わせページに表示されません。埋め込み先URLをformrunへ登録し、取得したコードを対象ページに設置します。
表示が出たら、スマホで入力できるか、エラー時に送信ボタンが隠れないか、通知まで届くかを分けて確認します。作業順は、2026年9月15日に確認した公式手順に基づきます。
埋め込む前にフォームとURLを用意
入力項目は、返信と判断に必要なものから作ります。名前・メール・相談内容に加え、電話番号や住所が本当に必要か考えましょう。入力の負担を増やさず済む項目は任意にし、何に使う情報か分かる案内とプライバシーポリシーへの導線を設置ページに用意します。
WordPress側では、設置する固定ページを決めておきます。例として https://example.com/contact/ を使いますが、自分のサイトのURLへ置き換えてください。
formrunは単独のフォームURLでも共有できます。WordPressへの埋め込みが必須ではないため、外部フォームへ移動する導線でよければ、リンクを置く方法もあります。フォーム共有の公式案内
サービス内容を読んだ流れで問い合わせてもらうなら埋め込み、短期の申込やSNSから直接案内するならURL共有が候補です。埋め込みではWordPress側の表示調整も必要になるため、同じページ内に置く理由がなければリンク共有から始めても構いません。
公開ページに置くフォームを作る
設置先URLと必要な入力項目が決まった方は、formrunでフォーム作成へ進めます。作成後は公開ページから一件送り、保存と通知までつながる状態に整えましょう。
公式サイトで料金・利用条件を確認
利用前にサービス案内へ移動します。自動返信など必要機能によって有料プランの検討が必要です。
フォームの共有設定から埋め込みコードを取得
公式手順では、設定画面の「埋め込み」から「＋追加」を選び、設置先URLを登録して更新します。それからスクリプトかフォームURLをコピーします。
設置先は公開予定のURLを登録します。httpsとhttp、wwwの有無が違うURLを同じつもりで扱わず、実際に開くアドレスを照合しましょう。管理画面のプレビューで見えないときは、公開URLでも同じ症状か分けて調べると、コードを何度も貼り直さずに済みます。
WordPressのプレビュー画面で動作を確認する場合も、プレビューURLの登録が必要です。公開ページのURLだけを登録して「下書きでは表示されない」ときは、この差を見ます。iframe埋め込みの注意事項
コードは自分のformrun画面から、そのフォーム用のものをコピーします。貼り付け前にフォーム名も確かめてください。複数のフォームを扱うときは、「ページURL・フォーム名・設置日」を一緒に残すと、後から変更する際に取り違えにくくなります。
WordPressのカスタムHTMLへコードを設置
WordPressの編集画面で「カスタムHTML」ブロックを追加し、自分のフォームから取得したコードを貼ります。通常の段落へ貼るとコードが文字として表示されることがあります。保存後は編集画面だけでなく、閲覧者が開くページから入力欄と送信ボタンをたどります。
プレビューでは見た目だけでなく、表示されたフォーム名、必須項目、送信ボタンまで確認します。設置後にフォームを修正した場合も、WordPress側で意図した内容が表示されているかを見直してください。
保存するとコードが消える場合は、編集権限やセキュリティ設定が影響していないか管理者へ相談します。サイト全体の保護を止める前に、保存後のコードと設置URLを見比べましょう。キャッシュを使っているサイトでは、変更後のページが表示されているかも切り分けます。
formrun公式には、WordPressを含むサイトへの設置を説明する動画ガイドもあります。編集画面の操作と、公開ページでの結果を照らして進めてください。
スマホと入力エラーの表示を確認
スマートフォン幅で、通常表示だけでなく必須項目を空にした送信も試します。エラー文が増えた後に送信ボタンへ進めるか、選択肢が枠の外で切れないかを見るためです。フォームの高さは、初期画面が収まることだけで決めないようにしましょう。
操作／確認する箇所
0 / 5 確認済み
項目数が多くドロップダウンが隠れる場合、公式は埋め込み方式の変更やiframeの高さ調整を案内しています。サイト全体へ一律のCSSを足す前に、対象フォームの幅と高さを確認します。公式共有手順の注意事項
フォーム自体が表示されないときは、埋め込み先URLのほかに、サイトのフレーム表示制限も確認対象です。安全のために設定された制限をまとめて無効化せず、サイト管理者と対象ページの設定を確認してください。表示されない場合の公式FAQ
表示が崩れたときの切り分け順
表示されないときは「公開ページのURLが登録済みか→保存後のコードが残っているか→公式の埋め込み制約に当たらないか」の順で絞ります。表示されるが下だけ切れるなら、高さや埋め込み方式が先です。WordPress側のCSSを変えてもiframe内へ同じように効くとは限らないため、まずformrun側の設定と公式案内を使います。
formrunの公式FAQにはiframe埋め込みの注意事項があります。WordPressの編集画面だけで判断せず、実際のページとスマートフォンで確認してください。ここに示す順番は作業案内であり、実機での再現結果ではありません。
回答の保存、通知、自動返信を順番に確かめる
最後は、自分で受信できるメールアドレスからテスト送信します。顧客の情報を使わず、件名や本文には接続確認のテストだと分かる内容を入れます。
一件のテストを「回答一覧に保存された」「担当者へ通知された」「送信者へ案内が届いた」の三つに分けて追います。保存だけ成功したのに通知も成功した扱いにすると、公開後の見落としにつながります。日時とテスト名を残せば、同じ送信を照合しやすくなります。
自動返信メールはBEGINNER以上の機能です。公式手順ではアプリから自動返信メールを利用できる状態にし、設定で「通常メール」を有効にして件名・本文等を保存します。自動返信の設定手順
自動返信には「受付済みであること」「回答の目安」「追加連絡の方法」を簡潔に書きます。たとえば営業時間外も受け付ける窓口なら、営業日を基準にした案内にします。実際に守れる予定を伝え、返信を待つ読者が次の行動に迷わない内容にしてください。
このガイドでは実サイトへの埋め込みやメール送信は行っていません。利用プランで確認できる範囲を整理したい場合は、14日試用と無料・有料の違いを参照できます。
公開の完了条件は、スマートフォンでも最後まで送れ、回答を受け取った担当が次の行動を決められることです。自動返信が必要な人はFreeと有料プランの条件を、複数人で使う人は担当・期限・引継ぎのルールを合わせて整えましょう。
