WordPressパスワードリセットフォームのカスタマイズ方法

デフォルトのWordPressパスワードリセットフォームは非常に基本的です。仕事はこなしますが、「プロフェッショナル」を叫んだり、ブランドのルックアンドフィールに一致したりするわけではありません。

カスタムパスワードフォームWordPressソリューションがないと、ブランドの一貫性を維持することを逃しています。さらに、役立つ指示を追加したり、リセットプロセスをスムーズにガイドするためのメッセージをカスタマイズしたりすることはできません。

そこで役立つのがWPFormsユーザー登録アドオンです。これにより、サイトに属しているように見える完全にカスタマイズされたパスワードリセットフォームを作成できます。

ウェブサイトの色、フォント、全体的なデザインに合わせながら、明確で役立つ指示を提供できます。それでは、さらに詳しく説明せずに、このガイドの手順に従ってWordPressパスワードリセットフォームをカスタマイズしてください！

カスタムパスワードリセットフォームを今すぐ作成！ 🚀

WordPressでカスタムパスワードリセットフォームを作成する方法

カスタムパスワードリセットフォームを作成するには、WPFormsのプレミアムバージョンを購読する必要があります。Proライセンスには、WordPressウェブサイト用のカスタムパスワードリセット、ユーザー登録、ログインフォームを作成できるUser Registrationアドオンが含まれています。始めましょう！

ステップ1：WPFormsプラグインをインストールする

まず、WPFormsをダウンロードしてインストールします。このチュートリアルでは、WPForms LiteではなくProバージョンが必要です。ヘルプが必要な場合は、WordPressプラグインのインストール方法に関するガイドをご覧ください。

プラグインをインストールしたら、WPFormsアカウントにログインし、ダウンロードタブをクリックします。これは、利用可能なすべてのライセンスが表示されるページです。

プラグインをダウンロードするには、Proライセンスの横にあるWPFormsのダウンロードボタンをクリックします。これにより、WPFormsプラグインのZIPファイルがコンピューターに保存されます。

ZIPファイルをダウンロードしたら、WPFormsをインストールしたいWordPressサイトに移動します。次に、管理ダッシュボードでプラグイン »新規追加をクリックし、次にプラグインのアップロードボタンをクリックします。

ここで、ファイルを選択ボタンをクリックし、ダウンロードしたばかりのWPForms ZIPファイルを選択します。ファイルがアップロードされたら、今すぐインストールボタンをクリックします。

プラグインがインストールされたら、プラグインを有効化ボタンをクリックして、サイトでWPFormsを有効化します。プラグインを有効化した後、自動更新とプラグインサポートを受け取るためにWPFormsライセンスキーを確認することを忘れないでください。

ライセンスキーを追加すると、WordPressダッシュボード内からWPFormsアドオンのインストールと有効化も簡単に行えるようになります。

ステップ2：User Registrationアドオンを有効にする

これでWPFormsの準備が整いました。カスタムパスワードリセットフォームを作成するには、User Registrationアドオンが必要です。WordPress管理エリアで、左側のサイドバーメニューのWPForms »アドオンに移動します。

ライセンスレベルのアドオンが表示されない場合は、アドオンの更新ボタンをクリックして強制的に更新します。

User Registrationアドオンを検索するには、ページ右上隅にあるアドオンの検索フィールドにその名前を入力します。

見つけたら、アドオンのインストールボタンをクリックするだけです。

これにより、アドオンが自動的にインストールされ、有効化されます。インストール済みで利用可能なアドオンは、ステータス：アクティブと表示されます。

ステップ3：パスワードリセットフォームテンプレートを使用する

さて、WordPressでカスタムパスワードフォームを構築する時間です。ダッシュボードのWPForms »新規追加に移動して、新しいフォームの作成を開始します。

テンプレートライブラリで「パスワードリセット」を検索し、ユーザーパスワードリセットフォームオプションにカーソルを合わせてテンプレートを使用をクリックします。

テンプレートを選択すると、パスワードリセットフォームが画面に読み込まれます。このテンプレートはパスワードリセット機能専用に設計されており、必要なフィールドがすべて事前に設定されています。

フォームには、ユーザーが登録済みのメールアドレスを入力できるメールフィールドが自動的に含まれています。これはパスワードリセットプロセスを機能させるためのコアコンポーネントです。

私は常に、ウェブサイトのブランディングに合わせてフォームのタイトルと説明をカスタマイズしています。編集するには、上部にあるフォームタイトルをクリックします。「パスワードをリセット」や「パスワードをお忘れですか？」のように、デフォルトから変更できます。

このテンプレートは非常に特定の目的を最適な方法で果たしているため、フィールドを追加または削除しないことをお勧めします。次のステップでリセットメールの設定を見てみましょう。

ステップ4：パスワードリセットメールを設定する

次に、パスワードリセットプロセスの動作を微調整する時間です。すべてのパスワードリセットオプションにアクセスするには、フォームビルダーで設定 » ユーザー登録に移動します。

まず最初に行うことは、パスワードリセット機能を有効にすることです。このトグルがオンになっていることを常に確認してください。そうしないと、ユーザーはカスタムフォームを通じてパスワードをリセットできなくなります。

有効になったら、リセットメールの件名をカスタマイズできます。デフォルトでも機能するかもしれませんが、私はブランドの声に合わせることを好みます。「[サイト名]のパスワードをリセット」のような件名は、一般的なテキストよりも個人的な感じがします。

リセットメールのメッセージを編集したい場合は、{user_registration_password_reset}スマートタグを削除しないように注意してください。このスマートタグは、ユーザーがクリックするためのリセットリンクを作成します。

さらに下にスクロールすると、ログイン中のユーザーからパスワードリセットフォームを非表示にするオプションが表示されます。このオプションを有効にすると、ログイン中のユーザーがフォームを開いたときに表示されるメッセージを編集できます。

素晴らしい！設定をカスタマイズしたら、必ず上部にある保存をクリックしてください。次のステップでは、フォームを新しいページに埋め込みます。

ステップ5：パスワードリセットフォームの外観をカスタマイズする

パスワードリセットフォームは機能していますが、次は見た目を良くする番です。適切に設計されたフォームは信頼を築き、リセットプロセスをよりプロフェッショナルに感じさせます。

WPFormsには便利な埋め込みウィザードがあり、フォームビルダーから直接、新しいページまたは既存のページ内にフォームを配置できます。その後、ブロックエディターで外観を直接カスタマイズできます。

フォームが保存されたら、埋め込むボタンをクリックします。フォームを新しいパスワードリセットページに埋め込みたいので、新しいページを作成オプションを選択します。

適切なページ名を入力し、開始をクリックします。その後、WPFormsがWordPressブロックエディターを開き、パスワードリセットフォームが埋め込まれているのが表示されます。

次に、右側のWPFormsブロックオプションを使用して、フォームのスタイリング機能を利用し、数回のクリックでラベル、フィールド、ボタンをカスタマイズします。

フォームに満足したら、公開を押して公開します。パスワードリセットフォームがライブになり、すぐに使用できるようになりました！

しかし、まだ終わりではありません。ユーザーがパスワードをリセットする必要がある場合に、このフォームを見つけやすくすることが重要です。次のステップでは、パスワードリセットフォームをサイトのメインナビゲーションに追加します。

ステップ6：ナビゲーションメニューにパスワードリセットフォームを追加する

パスワードリセットページをユーザーが見つけやすくすることは良い習慣です。新しいフォームページをサイトの上部ナビゲーションバーに追加することで、それを行います。

これは簡単です。WordPressダッシュボードを開き、外観 » メニューに移動します。サイトにすでにナビゲーションメニューが追加されている場合があります。

その場合は、パスワードリセットページをメニューに追加するだけです。メニュー画面に入ったら、左側の列にあるパスワードリセットフォームをクリックし、メニューに追加を押します。

これにより、パスワードリセットページが右側のメニューに現在スタックされているページのスタックに追加されます。メニューを保存ボタンを押して更新します。

初めてメニューを作成するプロセスはほぼ同様です。まずメニューに名前を付け、下部にある青いメニューを作成ボタンを押すだけです。

それが完了したら、上記の手順を使用してメニューにページを追加できます。ここに、私たちにとってナビゲーションがどのように見えるかの例を示します。

あとは、デフォルトのWordPressリセットページにアクセスしようとする訪問者が、新しいカスタムパスワードリセットページに自動的にリダイレクトされるようにリダイレクトを追加するだけです。

オプション：カスタムパスワードリセットフォームへのリダイレクトを追加する

ウェブサイトでパスワードをリセットするためのカスタムフォームを作成している場合は、サイト用にカスタムブランドのログインフォームを作成することも良い考えかもしれません。

また、デフォルトのWordPressログインページを新しいカスタムページに置き換えるリダイレクトを追加してください。ただし、デフォルトのログインページにまだアクセスできる場合は、パスワードリセットフォームへのリダイレクトを追加する必要があります。

これにより、ユーザーがWordPressログインページから「パスワードをお忘れですか？」リンクをクリックすると、デフォルトのWordPressパスワードリセットフォームではなく、上記で作成したカスタムパスワードリセットページにリダイレクトされます。

心配しないでください。言うより簡単です。まず、無料のWPCode WordPressプラグインをインストールします。WordPressダッシュボードで、プラグイン » 新規追加に移動します。

そこからWPCodeを検索し、今すぐインストールをクリックします。

有効化をクリックしたら、コードを追加する時間です。WordPressダッシュボードで、コードスニペット » + スニペットを追加をクリックします。

それをクリックすると、選択できるさまざまなコードオプションが含まれる既製のライブラリが表示されます。「カスタムコードの追加（新規スニペット）」オプションの下にある「スニペットの使用」をクリックします。

スニペットにタイトルを付けたら（ここでは「新しいパスワードリセットページ」としました）、コードプレビューの右側にある「コードの種類」ドロップダウンをクリックして、「PHPスニペット」を選択します。

次に、次のコードをエディタにコピーして貼り付けることができます。

上記のコードのreset-passwordを、新しいカスタムパスワードリセットページのスラッグに置き換えることを忘れないでください。

次に、挿入方法と場所を指定できる「挿入」セクションまで下にスクロールします。

挿入方法については、デフォルトの場所の選択「すべての場所で実行」と「自動挿入」を維持することをお勧めします。

完了したら、右上にある「スニペットを保存」ボタンをクリックします。次に、その隣にあるトグルスイッチをクリックして、コードスニペットをアクティブにします。

素晴らしい！これで、ユーザーがパスワードを忘れた場合のリンクをクリックするたびに、カスタムパスワードリセットページに常に表示されるようになります。

標準のWordPressパスワードリセットフォームからカスタムWPFormsリセットフォームに移行すると、ブランドイメージの向上以外にも多くのメリットが得られます。

たとえば、WPFormsの組み込みアンチスパム機能を使用してスパム対策機能を追加したり、フォームの送信に必要な最小時間を設定してスパムボットを撃退したりするなどの便利なオプションを使用できます。

詳細については、WordPressで不正なパスワードリセットを防ぐ方法に関するガイドに従って、これらのスパムリクエストを排除してください！

パスワードリセットフォームのカスタマイズ方法に関するFAQ

ここでは、WPFormsを使用してWordPressのパスワードリセットフォームをカスタマイズすることについて、よく寄せられる質問をいくつか紹介します。

パスワードリセットメールテンプレートをカスタマイズできますか？

はい、ユーザーが受信するパスワードリセットメールをカスタマイズできます。フォームの「通知」設定で、件名、メール本文を変更したり、独自のブランドを追加したりできます。

通常、明確な指示を含め、次に何が起こるかについての期待を設定します。ユーザーの名前や送信内容のその他の詳細でメッセージをパーソナライズするために、スマートタグを使用できます。

パスワードリセットフォームを送信した後、ユーザーをリダイレクトするにはどうすればよいですか？

これにはいくつかのオプションがあります。フォームビルダーの「設定」>「確認」に移動し、「ページの表示」または「URLに移動（リダイレクト）」を選択します。

私はしばしば、ユーザーに明確な次のステップを示すカスタムの「メールを確認してください」ページにリダイレクトします。これは、一般的な成功メッセージを表示するよりもプロフェッショナルに感じられます。

パスワードリセットフォームにフィールドを追加できますか？

もちろんです。基本的なパスワードリセットにはメールフィールドが必要ですが、WPFormsの利用可能なフィールドタイプを使用して、セキュリティの質問、電話番号、その他の検証フィールドを追加できます。

フィールドを追加しすぎると、ユーザーがフォームを完了するのを思いとどまらせる可能性があることを覚えておいてください。私は、必要な検証を取得しながら、シンプルに保つようにしています。

登録されていないメールアドレスがユーザーによって入力された場合、どうなりますか？

ユーザー登録アドオンがこれを自動的に処理します。ユーザーデータベースに存在しないメールアドレスが入力された場合、リセットメールは送信されませんが、エラーメッセージも表示されません（これにより、有効なメールアドレスを探すフィッシングを防ぎます）。

ユーザーの視点からは、どちらの場合も同じ確認メッセージが表示されます。これは私が非常に高く評価しているセキュリティ機能です。

パスワードリセットフォームをテーマに合わせてスタイル設定するにはどうすればよいですか？

WPFormsでは、フォームビルダー内でいくつかのスタイリングオプションを提供しています。ページエディターで埋め込まれたフォームをクリックすると、スタイリングパネルにアクセスでき、プリセットテーマから選択したり、色、フォント、スペーシングをカスタマイズしたりできます。

より高度なカスタマイズについては、カスタムCSSをテーマに追加することができます。ほとんどの場合、コードを必要とせずに組み込みのスタイリングオプションで対応できると考えています。

デフォルトのWordPressパスワードリセットを無効にして、カスタムフォームのみを使用できますか？

はい、ただしこれにはある程度の技術的な作業が必要です。WordPressのデフォルトのパスワードリセット動作を上書きするには、テーマのfunctions.phpファイルにカスタムコードを追加する必要があります。

通常、両方のオプションを利用できるようにすることをお勧めします。カスタムパスワードフォームWordPressをプライマリメソッドとして使用し、デフォルトのWordPressリセットを必要とするユーザーのバックアップとして機能させることができます。

パスワードリセットフォームへのスパム送信を防ぐにはどうすればよいですか？

WPFormsには、有効にできるいくつかのスパム対策機能が含まれています。カスタムキャプチャフィールドをオンにするか、フォームの設定 » 一般タブでhCaptchaを有効にします。

IPアドレスでフォーム送信を制限したり、ハニーポット機能を有効にしたりすることもできます。これらの方法は、実際のユーザーを苛立たせることなく、ほとんどのスパムを停止するために連携してうまく機能することがわかりました。

受信したパスワードリセットリクエストの数を追跡できますか？

はい、WPFormsはパスワードリセットリクエストを含むすべてのフォームエントリを自動的に記録します。送信の詳細、日付、ユーザー情報を表示するには、WPForms » エントリに移動します。

より詳細な分析が必要な場合は、Google Sheetsアドオンを使用してフォームをGoogle Sheetsに接続することで、時間の経過に伴うパターンを追跡できます。これにより、異常なアクティビティを特定したり、ユーザーがプロセスの特定の箇所で問題が発生しているかどうかを特定したりするのに役立ちます。

次に、パスワードリセットページをカスタマイズします

パスワードリセットフォームを新しいページに埋め込んだら、ブランド化したいと思うでしょう。

なぜですか？パスワードリセットフォームとページをブランド化することで、あなたが正当な会社であることを顧客に確固たるものにし、ブランド全体の信頼性を高めることができます。

WordPressでフォームページを作成およびカスタマイズするための完全なガイドに従ってください。さらに、WordPressでパスワードで保護されたページをカスタマイズする方法を学ぶこともできます。

また、WordPressのテーマカラーをカスタマイズする方法に関するガイドも参照して、ブランドカラーに合わせてフォームをスタイル設定してください。

WordPressフォームを今すぐ作成

フォームの作成準備はできましたか？最も簡単なWordPressフォームビルダープラグインで今日から始めましょう。WPForms Proには多くの無料テンプレートが含まれており、14日間の返金保証が付いています。

この記事がお役に立った場合は、FacebookとTwitterでフォローして、WordPressの無料チュートリアルやガイドをさらにご覧ください。