Contact Form 7を使いやすく！複数ファイルをドラッグ＆ドロップで添付できるようにカスタマイズ！

全世界で利用されているCF7なだけあって複数ファイルをアップロード出来るプラグインは存在しますが今回使用するのは「Drag and Drop Multiple File Upload – Contact Form 7」！（2022年4月現在）

今までは「Multifile Upload Field for Contact Form 7」や「Multiline files upload for contact form 7」といったプラグインを利用してきたんですが、WordPressのバージョンアップに対応してなかったり、ファイルアップロードを複数設置が出来なかったり、様々な不具合が発生！その度に不具合を調査し、原因を解決していましたが、現在はこのプラグインを使用しています！エンジニアって大変・・・笑

プラグインをダウンロードすると管理画面内のお問い合わせの設定箇所に「Drag & Drop Upload」が追加されているのでこちらから設定を行います！

そして開くのがこのページ！

このページでサイト内に出力されるメッセージやタグを設定します！

英語が苦手な諸君！落ち着きたまえ。私がお手本用の日本語を書いておいたので参考にするがいい！（何様）

これを参考に自分の好きなメッセージや設定に変更してお使いください！

※Max File Limit（最大アップロードファイル数）は今回は5個に設定してあります。

CF7のタグ一覧に「multiple file upload」のタグが追加されているのでフォームに入れるタグの設定を行います！

受け入れ可能なファイルは受信したいファイルの拡張子を自由に設定できます！mp4等の動画やexcel（.csv ）、word（.doc ）等のOffice系ファイルも設定可能です！

Max file uploadはプラグインの設定で5個に設定したので「5」にしてあります。

ここで注意点！

「ファイルサイズの上限（バイト）」にはメガバイト（mb）で指定できないので5メガの場合は「5242880（5 メガバイト = 5242880）」と記載しないと上限が設定出来ませんのでご注意！バイトの換算方法はググれ！！！！！！！！！

そして完成したタグがこちら！

[mfile upload-file-01 limit:5242880 max-file:5]

これをいつものようにフォーム内に設置します！

あとはファイルを選択orドラッグ＆ドロップでファイルをアップロードするだけ！アップロードしたファイルもポチポチっと削除も出来るので間違えてアップしてしまった時にも便利！

これで標準機能の80倍便利なフォームが完成！！！

以上今回はContact Form 7を便利に使う為のカスタマイズ方法をご紹介させていただきました！

利用するユーザーがいかに使いやすいか、いかに楽が出来るかを追求するのがコーダー・エンジニアのお仕事です！（かっこいい）

Contact Form 7にファイルを設置している方はぜひ導入してみてはいかがでしょうか！

というわけで本日はこの辺で！次回の記事でお会いしまSHOW TIME!!オオタニサーン！