この記事で分かること
WordPress（またはHTMLサイト）に 問い合わせフォームを埋め込む 手順と、表示トラブルを防ぐポイントを説明します。プラグイン必須ではなく、外部フォームを埋め込む方法が中心です。
埋め込みのメリット
- WordPress側で複雑なフォームプラグインを増やさなくてよい
- フォームの改修・通知設定をフォームツール側で完結できる
- テーマ更新の影響を受けにくい
一方で、見た目の完全一致や高度なWP連携が必要な場合は、専用プラグインの方が向くこともあります。
手順（外部フォームを埋め込む）
- フォーム作成ツールでお問い合わせフォームを作る
- 公開し、埋め込み用コード（iframe 等） を取得する
- WordPressの投稿／固定ページで「カスタムHTML」ブロックに貼る
- プレビューでスマホ幅の表示を確認する
- テスト送信で通知・自動返信を確認する
リンク誘導だけなら、ボタンのURLに公開ページを設定するだけで十分です。関連: 「自社サイトにフォームを埋め込む方法」「無料でお問い合わせフォームを作る方法」
よくある表示トラブルと対処
| 症状 | 確認すること |
|---|---|
| 高さが途切れる | iframeの高さ、親要素のoverflow |
| スマホで横スクロール | 幅100%、親のmax-width |
| 真っ白／表示されない | HTTPS混在、コンテンツセキュリティポリシー |
| スタイルが崩れる | テーマCSSの干渉、埋め込み側の余白 |
埋め込み前のチェック
- プライバシーポリシーへの導線があるか
- サンクスメッセージと自動返信があるか
- 本番ドメインでテストしたか（キャッシュの影響に注意）
テンプレートから始める
埋め込むフォームをまだ作っていない場合は、フォームテンプレート一覧から近い用途のテンプレートを選ぶとスムーズです。
まとめ
WordPressへの設置は「作る・公開する・埋め込む・テストする」の4ステップです。まずは1ページに埋め込んで送信確認まで済ませると安心です。