WordPressのプラグイン「Contact Form 7」で画像を送ってもらう

WordPressのお問合せフォームとして、いつも使わせていただいている「Contact Form 7ですが、今回設置するフォームに「画像を添付して送ってもらう機能が欲しい」と、依頼がありましたので設定してみました。

1.フォームボタンから項目を追加

まずはいつものように、Contact Form 7をプラグインの追加から、追加した後にフォームの項目設定を行います。
既に「ファイル」というボタンが用意されているのでこちらをクリック。

Contact Form 7で画像を送信

2.ファイルサイズの上限やファイル形式を選択

先ほどの「ファイル」ボタンをクリックすると、こちらのウィンドーが表示されますので、ファイルサイズの上限やファイル形式などを入力します。
※jpg,jpg,pdf等、カンマを入れて複数指定できます。

Contact Form 7で画像を送信

3.タグを挿入する

上の↑タグをコピーして、フォーム内に貼り付けます。

Contact Form 7で画像を送信

4.メールタブでファイル添付の設定

次はメールタブに切り替えます。

Contact Form 7で画像を送信

メールタブの一番下の方に「ファイル添付」という項目があるので、そこに設定したタグを挿入します。

Contact Form 7で画像を送信

5.固定ページに貼って動作確認

最後はフォームのタグを固定ページに貼り付けます。
このように、「ファイルを選択」ボタンが表示されました。

Contact Form 7で画像を送信

こちらのフォームからのメールを受信しますと、添付ファイルとしてメールに画像が添付されて届きました。

ちなみに、複数設定できますので、「ファイル」ボタンからいくらでも増やせます。

にほんブログ村 デザインブログ Webデザインへ

関連記事

  1. WordPress標準搭載のギャラリー機能でギャラリーを作成する

  2. Jetpack スライドショーの背景色を変更する

  3. WordPress ブロックエディター 記事投稿マニュアル(ダウンロード用PDF)

    WordPress ブロックエディター記事更新マニュアル(PDFダウン…

  4. microdataでHTML5のパンくずリストを作成

  5. ロリポップで「不正なアクセスを検知いたしました」とメールが来てWord…

  6. JetPack タイルギャラリーの使い方

コメント

  1. この記事へのコメントはありません。

  1. この記事へのトラックバックはありません。

CAPTCHA


最近の記事

  1. WordPress ブロックエディター 記事投稿マニュアル(ダウンロード用PDF)
  2. 「雑誌取材」や「TV番組取材」という名目の広告営業にご注意!
  3. フリーランスに必要な「稼ぎ力」「継続力」を身につける
  4. ブログって何をどう書いたらいい?

アーカイブ

制作実績一覧

  1. 沖口まこと体操クラブ
  2. やまもとサンクリニック/西宮
  3. 山崎由香のHappyLifeブログ
  4. HappyLife様
  5. salondeuniverse
  6. Nai‘a~ナイア~
  7. M-Style
  8. みなとワンピース
  9. オーダースーツ 中山手縫製所