お問い合わせフォームをつくれるプラグイン「Contact Form 7」で添付ファイル（画像ファイルなど）を送信可能にする方法を解説します。プラグインに用意されているオプションから簡単に設定できますが、
「うまく送信できない」
「メールに画像が添付されていない」
などの問題が発生することもあります。そこで当記事では、正しい設定方法と、問題発生時のチェック箇所も併せて解説いたします。お問い合わせフォームで画像を添付できると、ユーザー・管理者の双方で便利なので、ぜひ参考に設定してみてください。
目次
Contact Form 7で添付ファイルを送受信する設定
添付ファイルを送受信できるようにする設定は、次の2ステップのみで実現できます。
- フォーム内にファイル添付項目を設置する（フォームタブの設定）
- 添付ファイルがメールに届くように設定（メールタブの設定）
1.フォーム内にファイル添付項目を設置する（フォームタブの設定）
まずは、添付ファイルを送信できるようにしたいフォームの編集画面を開きます。デフォルトで用意されている「ファイル」というボタンから設定できます。
展開するこの画面で詳細設定を行います。
添付ファイルのサイズ制限や、拡張子の制限はここで行えます。複数のファイル形式を受け入れる場合は、「|」で区切って入力します（例：jpg|jpeg|png|gif）。
設定が済んだら右下の「タグを挿入」でフォーム内に追加されます。
ここまでの設定で、サイト上のフォーム内に添付ファイルの項目が表示されます。
ここまででファイルを添付・送信できそうなのですが、管理者側がメールでファイルを受け取るためには、次の設定も必須です。
2. 添付ファイルがメールに届くように設定（メールタブの設定）
フォームの編集画面の「メールタブ」を開いて、下の方にある「ファイル添付」の入力欄を確認します。
ここに1.で設定した「ファイル添付項目の名前」を追加すればOKです。今回の例の場合、デフォルトの設定のままですので、[file-40]となっている部分です。
ちゃんと上記箇所に表示されるので、そこからコピペすれば問題ありません。
最後に「保存」を押して設定完了です。
この2ステップの設定が済んだら、正常に送信できるか必ずテストしておきましょう。
添付ファイルを送受信できないときは？
「正常に送信できない」「送信できるが、ファイルが添付されない」等の問題が発生した場合、次の箇所を見直してみましょう。
- フォームタグの設定ミスがないか
- メールタブの設定漏れがないか
- 添付ファイルの保存先フォルダがあるか
- サイズや拡張子の制限をクリアしているか
フォームタグの設定ミスがないか
これは可能性としては低いですが、添付ファイルの項目用のタグが誤っている場合です。
後から手動で名前を変更したり、拡張子の制限を変更したりすると、意図しない挙動になる可能性があります。用意されている「ファイル」ボタンから設定を変更して挿入し直すのが最も確実です。
メールタブの設定漏れがないか
既存のフォームに「添付ファイル」の項目をサクッと追加したい場合など、メールタブの設定が抜けることがあるかもしれません。先述の「2. 添付ファイルがメールに届くように設定（メールタブの設定）」は必ず確認してください。
サイト上ではファイルを添付して送信できても、管理者側に肝心のファイルが届かないという致命的な問題が発生します。「送信できるのに届かない問題」を起こさないようにしましょう。
添付ファイルの保存先フォルダの有無
これは稀なケースかもしれませんが、「添付ファイル保存用のフォルダ」が何らかの原因で削除されている場合です。
通常は「Contact Form 7」を有効化すれば自動で生成される「wpcf7_uploads」というフォルダがあるのですが、これが無い場合、正常に送信できない問題が発生します。
レンタルサーバーのファイルマネージャやFTPソフトを使って操作ミスで削除した場合などは、再度手動で作成すれば問題ありません。下記箇所にフォルダがあるはずですが、無ければ「wpcf7_uploads」という名称で新規作成しましょう。
サイズや拡張子が制限内か
フォーム設定時に管理者自身で設定する箇所ですが、念の為チェックしておきましょう。
フォーム内の設定時に制限した内容に引っかかる場合は、こういったエラーメッセージが表示されて送信できません。ファイルサイズを2MBと制限しているのに、それ以上のサイズのファイルを添付しようとした際などです。
サイズや拡張子の制限は運用方法にフィットするように設定しておきましょう。「1.フォーム内にファイル添付項目を設置する（フォームタブの設定）」から見直せます。
おまけ：仕上げに文言や注釈を整えよう
無事送受信できるようになったら、仕上げに文言や注釈を整えておくとベターです。
弊社（当サイト）のお問い合わせフォームでも画像を添付できるように設定していますが、他の項目とスタイルを揃えて、文言や注釈を整えています。
フォームの運用方法によって様々ですが、弊社では以下が伝わるように記載しています。
- 参考画像をアップできる旨
- スクリーンショットを貼り付けられる旨
- サイズが制限されている旨
- ファイル形式（拡張子）が制限されている旨
「何のための項目か、どうして送信できないのか」の参考になるような注釈を記載しておくわけです。
制限している拡張子について社内確認した際、「Macでは対象ファイルを選択すらできないが、Windowsでは選択まではできる」等の環境差もありました。簡単な注釈が書いてあるだけでも、ユーザーの戸惑いを減らせるかもしれませんね。
Contact Form 7関連の記事
WordPressサイトのお問い合わせフォームには、「Contact Form 7」（CF7）がよく使われています。日本製のプラグインで人気です。 今回は、CF7で作ったフォームに「同意のチェックボックス」を設置する方法をご紹介いたします。拡張プラグイン不要ですぐに設定可能です。 同意のチェ...
「お問い合わせフォームで、特定のメールアドレスからの受信を拒否できるようにしたい。」 スパムや迷惑メールなど。セキュリティ上の観点からそのようなケースがあると思います。当記事では、プラグイン「Contact Form 7」で作成したお問い合わせフォームで、特定のメールアドレスからの受信を拒否す...
WordPressサイトのお問合せフォームには、「Contact Form 7」がよく使われています。日本製のプラグインで人気です。 当サイト（TCD公式）のお問い合わせフォームでも活用させていただいていますが、セキュリティ面を考えるとスパム対策は必須です。そこで今回は、最も簡単で実用的なre...
Contact Form 7でつくったフォームを対象に、問い合わせフォームを複数のページに分割したり、確認画面を追加できるプラグインをご紹介いたします。 確認画面を追加するプラグイン「Contact Form 7 add confirm」に関しては、一部のプラグインと併用すると正常に送信できな...
「Contact Form 7」はお問い合わせフォームが作成できる、WordPressの定番プラグインです。今回紹介する「Contact Form 7 Conditional Fields」は、Contact Form 7をカスタマイズして条件分岐を追記できるプラグインです。 例えば、お問い合...
コメント