サイトのフォームにファイルやメディアを追加できる機能をユーザーに提供することで、必要な情報を簡単に収集できるようになります。そのためにファイルアップロードウィジェットが必要なのです。
複雑なコーディングや信頼性の低いプラグインを扱うことなく、シームレスなプロセスを実現する方法について心配しているかもしれない。誰だって、簡単なはずのトラブルシューティングに何時間も費やしたくはないでしょう。
そこで、このガイドでは、WordPressでファイルアップロードウィジェットを作成し、ウェブサイトの訪問者からファイルを受け取る方法を紹介します。
WordPressのファイルアップロードウィジェットフォームを今すぐ作成しましょう
WordPressでファイルアップロードウィジェットを作成する方法
フォームで収集したい情報の種類にもよりますが、WordPressのアップロードウィジェットを使用することは、ユーザーからより多くの情報を素早く簡単に取得するための最良の方法の一つです。
例えば、訪問者がWordPressに画像をアップロードできるようにするためのフォーム設置に最適です。フォームへの入力を簡単にし、アクセスしやすくすることで、フォームの放棄率を減らし、WordPressウェブサイトがより多くの収益を生み出せるようになります。
また、WordPressのアップロードフォームで追加ファイルの種類を受け付ける方法を学ぶこともできますし、ファイルのアップロードに支払いを要求したい場合は、別のガイドに飛ぶこともできます。
WordPressでファイルアップロードウィジェットを作成する方法については、ビデオチュートリアルをご覧ください。
WordPressアップロードウィジェットを作成する前に、WordPressファイルアップロードフォームを作成する必要があります。すでに作成済みの場合は、ステップ6に進んでください。
ステップ1: WordPressにファイルアップロードフォームを作成する
WPFormsはファイルアップロードに最適なプラグインです。Google Forms のファイルアップロード機能とは異なり、WPForms ではフォームページだけでなくサイトのどこにでもファイルアップロードを追加することができます。
まず最初にWPFormsプラグインをインストールして有効化します。インストール方法の詳細については、WordPressにプラグインをインストールする方法のステップバイステップガイドを参照してください。
次に、WordPressのダッシュボードに行き、左側のメニューからWPForms " Add Newをクリックして新しいフォームを作成し、好きな名前を付けます。
次に、テンプレートを選択セクションまでスクロールダウンし、ファイルアップロードフォームテンプレートを検索します。次に、テンプレートを使用するをクリックして開きます。
これで WPForms は事前に作成されたファイルアップロードフォームを入力し、ドラッグアンドドロップビルダーを表示します。
ここで、左側のパネルから右側のプレビューエリアにドラッグすることで、フォームにフィールドを追加することができます。または、ステップ6で追加したフォームがアップロードウィジェットにうまく収まるようにフィールドを削除することもできます。
ファイルアップロードフォームテンプレートでは、名前、Eメール、電話番号、ファイルアップロード、追加コメントフィールドがすでに用意されています。
フォームフィールドのいずれかをクリックして変更します。また、フォームフィールドをクリックしてドラッグすると、コンタクトフォームの順番を並べ替えることができます。
この例では、電話番号と追加コメントフィールドを削除して、このフォームを小さくし、ウィジェットにうまく収まるようにします。フィールドを削除するには、ゴミ箱アイコンをクリックしてください。
ファイルアップロードフィールドはWordPressで作成したフォームに追加することもできます。Fancy Fieldsの下にあるFile Uploadフォームフィールドを左側のパネルからプレビューエリアにドラッグするだけです。
ステップ2：ファイルアップロードフィールドオプションの設定
ファイルアップロードフィールドをクリックしてフィールドオプションを開き、カスタマイズすることができます。
ここで変更できる：
- ラベル - フォームフィールドに名前を付け、サイト訪問者に何のためのフィールドか分かるようにします。
- 説明 - ユーザーに詳細を説明する説明を追加します。例えば、画像だけをアップロードしてほしい場合は、そのように伝えましょう。
- 許可するファイル拡張子- WordPressのフォームにアップロードできるファイルの種類を制限したい場合は、カンマで区切ってここに入力してください。
- Max File Size - ユーザーにアップロードを許可するファイルの最大サイズをメガバイト単位で指定します。ここに数値を入力しない場合、WPFormsのデフォルトはサーバーが許可する最大ファイルサイズになります。これを変更する必要がある場合は、WordPressの最大ファイルアップロードサイズを増やす方法についてのチュートリアルを参照してください。
- 最大ファイルアップロード数 - モダンスタイルのファイルアップロードフィールドを使用している場合、ユーザーが一度にアップロードできるファイル数に制限を設定できます。
- 必須 - ユーザーがフォームを送信する前にファイルのアップロードを要求する場合は、このチェックボックスを選択します。
詳細設定タブには、さらに多くのオプションが用意されている。
- スタイル- デフォルトのモダンスタイルとクラシックスタイルを切り替えることができます。モダンフィールドアップロードフィールドでは、ユーザーがファイルをフォームにドラッグ＆ドロップし、複数のファイルをアップロードすることができます。クラシックスタイルでは、ユーザーがコンピュータからファイルを選択するための「ファイルを選択」ボタンが表示されます。
- WordPressメディアライブラリにファイルを保存 - デフォルトでは、ユーザーによってアップロードされたすべてのファイルは、サイトのUploadsディレクトリ内のWPFormsフォルダに保存されます。より簡単にするために、これらのファイルをWordPress Media Libraryに保存することもできます。
- ファイルアクセス制限を有効にする- ユーザーの役割に基づいて、またはパスワード保護を追加することによって、アップロードされたファイルへのアクセスを制限します。
- Hide Label- フォームフィールドラベルを隠す
また、WordPressでマルチステップフォームを作成する方法の投稿にあるステップに従うことで、フォームを見栄えの良いものにすることができます。しかし、このチュートリアルのために、私たちはシングルページにこだわります。
フォームが思い通りに表示されたら、ビルダーの右上にある「保存」をクリックします。
ステップ 3: ファイルアップロードフォームの設定をカスタマイズする
開始するには、設定"一般に進みます。
ここでは以下の設定ができる：
- フォーム名 - 必要であれば、ここでフォーム名を変更してください。
- フォームの説明 -フォームに説明を付けます。
- タグ - フォームにタグを追加して整理できます。
- 送信ボタンテキスト -送信ボタンのコピーをカスタマイズします。
- 送信ボタン処理テキスト -フォームの送信中に表示されるテキストを変更します。
次に、Advancedセクションを展開し、以下の設定も行う：
- CSSクラス -フォームや送信ボタンにカスタムCSSを追加できます。
- URL による事前入力 - URL に基づいていくつかのフィールドを自動的に入力します。
- AJAXフォーム送信を有効にする - ページリロードなしでAJAX設定を有効にします。
- WordPress で入力情報の保存を無効にする -GDPR の要件に準拠するために、IP アドレスやユーザーエージェントなどの入力情報やユーザー情報の保存を無効にすることができます。シンプルなお問い合わせフォームにGDPRの同意フィールドを追加する方法については、ステップバイステップの説明をご覧ください。
一般設定が終わったら、スパム対策とセキュリティ設定に移動します。
ここでは、さらにいくつかの設定を行うことができます：
- スパム対策を有効にする -スパム対策機能、hCaptcha、またはGoogle reCAPTCHAを使ってコンタクトフォームのスパムを阻止しましょう。スパム対策チェックボックスはすべての新規フォームで自動的にチェックされます。
- Akismet アンチスパムプロテクションを有効にする -Akismet プラグインを使用してスパムを管理している場合、このフォームに接続して偽のエントリーを防ぐことができます。
- カントリーフィルターを有効にする -特定の国からのエントリーを防ぐことができます。
- キーワードフィルターを有効にする -特定の語句を含む投稿をブロックします。
終わったら、Saveをクリックする。
ステップ 4: フォームの通知を設定する
通知は、誰かがWordPressアップロードウィジェットにファイルを送信したことを知るための優れた方法です。
また、通知機能を無効にしない限り、誰かがあなたのサイトでフォームを送信するたびにEメール通知が届きます。
誰かがフォームに入力したときにEメールを受け取るには、WordPressでフォーム通知を設定し、Eメールアドレスを入力する必要があります。
また、スマートタグを使用すると、サイト訪問者がフォームを完了すると、フォームを受け取ったことを知らせるパーソナライズされた通知を送ることができます。これにより、ユーザーはファイルアップロードとともにフォームが正しく通過したことを確認できます。
詳しくは、WordPressで複数のフォーム通知を送信する方法のステップバイステップガイドをご覧ください。
また、スマートタグを使用して、アップロードされたエントリーファイルへのリンクをメール通知に含めることもできます。
または、添付ファイルとしてファイルを含めることもできます。通知の詳細設定までスクロールし、ファイルアップロード添付を有効にしてください。
メールプロバイダーによって、添付ファイルのサイズに制限がある場合があります。添付ファイルのサイズが大きいと、メールが正しく配信されない場合があります。
最後に、カスタムヘッダ画像エリアにロゴまたは任意の画像を追加することで、通知メールを簡単にブランディングするオプションがあります。選択したロゴ/画像は下のWPFormsロゴのように通知メールの上部に表示されます。
ステップ 5: ファイルアップロードフォームの確認を設定する
フォームの確認は、ユーザーがWordPressのアップロードウィジェットに情報を送信した後、即座に(自動的に)アクションを起こす方法です。このステップに関する詳しいヘルプは、フォーム確認のセットアップ方法のチュートリアルをご覧ください。
WPFormsには3種類の確認があります：
- メッセージ - これは誰かがフォームの送信を押した後に表示されるデフォルトの確認タイプで、カスタマイズすることができます。サイト訪問者の満足度を高めるために確認メッセージをカスタマイズする方法についてのヒントをご覧ください。
- 表示ページ - サンキューページのようなサイト上の任意のページにユーザーを自動的に送ります。
- リダイレクト -より複雑な開発のために、ユーザーを別のウェブサイトや特別なURLに移動させたい場合に便利です。
それでは、WPFormsで簡単なフォーム確認を設定し、サイト訪問者があなたのサイトでフォームを送信したときに表示される成功メッセージをカスタマイズする方法を見てみましょう。
まず、フォームエディターの「設定」にある「確認」タブをクリックします。
次に、作成したい確認タイプを選択します。この例では、「メッセージ」を選択します。
その後、確認メッセージをお好みに合わせてカスタマイズし、完了したら「保存」をクリックします。
これでウェブサイトのウィジェットにフォームを追加する準備ができました。
ステップ 6: ファイルアップロードフォームをウィジェットに追加する
フォームを作成したら、WordPressサイトのウィジェットエリアに追加することができます。
WPFormsを使用すると、ページ、ブログ記事、WordPressウィジェットなど、ウェブサイトの複数の場所にフォームを追加することができます。
ファイルアップロードフォームをウィジェットに追加し、独自のアップロードウィジェットを作成するには、WordPressダッシュボードの左側メニューから「外観"ウィジェット 」をクリックします。
ここでは、WordPressテーマが提供するウィジェットエリアのための異なるセクションが表示されます。ファイルアップロードフォームを追加したいエリアのセクションを展開します。この例では、サイドバーに設置します。
プラス（+）ボタンをクリックしてウィジェットエリアに新しいブロックを追加し、WPForms ブロックを選択します。すぐに表示されない場合は、検索することができます。
次に、WPForms ブロックのドロップダウンからファイルアップロードフォームを選択します。
ファイルアップロードフォームがウィジェットにロードされます。ファイルアップロードウィジェットをライブにするには、更新ボタンをクリックするだけです。
これで完了です！ファイルアップロードフォームは、あなたのウェブサイトのWordPressウィジェットに設置されました。
ステップ 7: 提出されたファイルを見る
WPForms は各フォーム送信をWordPress データベースのエントリとして保存します。アップロードされたファイルを表示するには、WPForms"Entriesに移動します。そしてファイルアップロードウィジェットのフォーム名をクリックします。
すべてのエントリーを表示したら、個々のエントリーの「アクション」列の「表示 」をクリックして、WordPressのアップロード・ウィジェットからアップロードされたファイルにアクセスすることができます。
ファイルを右クリックしてダウンロードするか、ファイルをクリックしてブラウザで表示することができます。
さらに、私たちのZapierアドオンを使えば、すべてのファイルアップロードを自動的に保存することができます：
あなたのアップロードフォームやウェブサイトがどのように利用されているかを知るには、WordPressにGoogle Analyticsをインストールする方法をご覧ください。
FAQ - WordPressでファイルアップロードウィジェットを作成する方法
WordPressにファイルアップロード機能を追加するには？
WordPressにファイルアップロード機能を追加するには、WPFormsのようなプラグインを使います。WPFormsをインストールし、新しいフォームを作成し、ファイルアップロードフィールドを追加するだけです。そして、希望のページやウィジェットエリアにフォームを埋め込む。
WordPressはファイルのアップロードに対応していますか？
WordPressはデフォルトでファイルアップロードをサポートしていますが、WPFormsのようなプラグインを使えばこの機能を強化することができます。
誰かがWordPressにファイルをアップロードできるようにするにはどうすればよいですか？
誰かがあなたのWordPressサイトにファイルをアップロードできるようにするには、WPFormsを使用します。 ファイルアップロードフィールドを 持つフォームを作成し、サイトに設置します。訪問者はこのフォームを使ってWordPressのメディアライブラリに直接ファイルをアップロードすることができます。
WordPressに画像のアップロードボタンを追加するには？
WordPressに画像のアップロードボタンを追加するには、WPFormsを使います。フォームを作成し、画像ファイルを受け付けるように設定できるファイルアップロードフィールドを含めます。これにより、ユーザがサイトを通じて画像をアップロードする簡単な方法が作成されます。
次に、WordPressでAdobe Illustratorのアップロードを許可する。
デザイナーからのファイルを受け取りたい場合は、WordPressでAdobe Illustrator（AI）のアップロードを有効にする方法をぜひご覧ください。中小企業のマーケティングに関する素晴らしいヒントが掲載された記事もぜひご覧ください。
フォームを作る準備はできましたか？最も簡単なWordPressフォームビルダープラグインで今すぐ始めましょう。WPForms Proにはたくさんの無料テンプレートが含まれており、14日間の返金保証がついています。
この記事がお役に立ちましたら、Facebookや TwitterでWordPressの無料チュートリアルやガイドをフォローしてください。
