WordPressのログアウトリンクをナビゲーションメニューに追加する方法

WordPressサイトを複数運営する中で、細部が大きな違いを生むことを学びました。

そのため、オンラインストアやWP101のWordPress特化型トレーニングプラットフォームに、使いやすいログアウトリンクを追加しました。

ナビゲーションメニューに直接ログアウトリンクがあると、ログイン中のユーザーにとって便利です。

プロフィールに移動したり、特定のURLを覚えたりする必要がなく、サイトのどこからでもワンクリックでログアウトできます。

このガイドでは、これを達成するためのいくつかの異なる方法を紹介します。これにより、サイトの設定とデザインに最適なアプローチを選択できます。

WordPressナビゲーションメニューにログアウトリンクを追加する

WordPressのログアウトリンク

通常、WordPressサイトからログアウトするには、「ログアウト」リンクをクリックします。このリンクは、WordPress管理バーの右上にあるプロフィール写真の下にあります。

ユーザー名の上にマウスカーソルを合わせるだけで、ドロップダウンメニューに表示されます。

WordPress管理バーのログアウトリンク

あなたまたはあなたのサイト管理者がWordPress管理バーを無効にした場合、WordPressのログアウトリンクは表示されません。

良いニュースは、WordPressのログアウトリンクに直接アクセスして現在のWordPressセッションからログアウトできることです。

WordPressサイトのログアウトリンクは次のようになります。

http://example.com/wp-login.php?action=logout

example.com をご自身のドメイン名に置き換えるのを忘れないでください。

ブラウザウィンドウでこのリンクに直接アクセスして、WordPress サイトからログアウトできます。

このリンクをクリックすると、警告ページに移動します。ログアウトを本当に実行したいことを確認するために、「ログアウト」リンクをクリックする必要があります。

ログアウト確認

また、WordPressウェブサイトのどこにでも、このログアウトリンクを手動で追加することもできます。その方法を見てみましょう。

WordPressのログアウトリンクをサイトのナビゲーションメニューに追加すると、ウェブサイト上のどのページからでも簡単にアクセスできるようになります。

WordPress管理画面の「外観」→「メニュー」ページにアクセスしてください。その後、「カスタムリンク」タブをクリックして展開し、URLフィールドにログアウトリンクを追加します。

ナビゲーションメニューにログアウトリンク

完了したら、「メニューに追加」ボタンをクリックすると、リンクが右側の列に表示されます。ドラッグアンドドロップで簡単に位置を調整できます。

変更を保存するには、「メニューを保存」ボタンをクリックすることを忘れないでください。

これで、WordPressブログにアクセスして、ナビゲーションメニューにログアウトリンクが表示されていることを確認できます。

ナビゲーションメニューのログアウトリンク

メニューにログアウトリンクを追加する問題点は、ログインしているユーザーとログアウトしているユーザーの両方に表示されてしまうことです。実際にログインしているユーザーにのみログアウトリンクを表示するのが理にかなっています。

これは、ログインユーザーに異なるメニューを表示する方法に関する指示に従うことで行うことができます。

WordPressには、Metaというデフォルトのウィジェットが付属しています。このウィジェットは、ユーザー向けのログアウトまたはログインリンクを含む、便利なリンクのセットを表示します。

WordPressのメタウィジェット

メタウィジェットの他のリンクがあまり役に立たないと感じる人もいます。

代わりに、プレーンテキストまたはカスタムHTMLウィジェットにログアウトリンクをプレーンHTMLで追加することもできます。追加する必要のあるHTMLコードは次のとおりです。

<a href="http://example.com/wp-login.php?action=logout">ログアウト</a>

ログアウトHTMLウィジェット

WordPressにログアウトリンクを手動で追加すると、ユーザーのログイン状態に応じて変化しないという問題があります。

その問題を解決するには、ユーザーのセッションに基づいてログインまたはログアウトリンクを動的に表示するプラグインを使用できます。

まず、Login or Logout Menu Itemプラグインをインストールする必要があります。詳細は、WordPressプラグインのインストール方法のステップバイステップガイドをご覧ください。

プラグインをインストールして有効化した後、WordPress管理画面の外観 » メニューに移動し、「ログイン/ログアウト」リンクをメニューに追加する必要があります。

ログインログアウトメニュー WordPressプラグイン

「メニューを保存」をクリックしてWordPressのウェブサイトを確認すると、メニューにリンクが表示されます。

このようになります。

メニューにログインリンク

それをクリックすると、ログインページに移動するか、すでにログインしている場合はログアウトされます。

この方法は、WooCommerceMemberPress、およびその他のWordPress eコマースプラットフォームでも機能します。

動画チュートリアル

説明を読むのが好きでない場合は、ビデオチュートリアルをご覧ください。

WPBeginnerを購読する

WordPressログインフォームに関するエキスパートガイド

この記事が、WordPressの直接ログアウトリンクを見つけてナビゲーションメニューに追加するのに役立ったことを願っています。WordPressへのログインとログアウトに関連する他のガイドも参照してください。

この記事が気に入ったら、WordPressのビデオチュートリアルについては、YouTubeチャンネルを購読してください。 TwitterFacebookでもフォローできます。

開示:当社のコンテンツは読者によってサポートされています。これは、当社のリンクの一部をクリックすると、当社が手数料を得る可能性があることを意味します。WPBeginnerがどのように資金提供されているか、それがなぜ重要か、そしてどのように私たちをサポートできるかについては、こちらをご覧ください。当社の編集プロセスはこちらです。

究極のWordPressツールキット

無料のツールキットにアクセスしましょう - すべてのプロフェッショナルが持つべきWordPress関連の製品とリソースのコレクションです!

読者とのインタラクション

25 CommentsLeave a Reply

  1. 目立つログアウトボタンがあれば、ユーザーがログアウト方法を見つけにくいためにログアウトしないといったセキュリティ上の懸念はほぼ解消されます。したがって、セキュリティの観点からは、これは素晴らしいソリューションです。

  2. 素晴らしいプラグインで気に入っています。作成したログイン/登録ページにリンクをポイントすることは可能ですか?

  3. こんにちは。
    ガイドをありがとうございます。デスクトップとタブレットでうまくいきました。
    しかし、ログアウトをトップメニューまたはプライマリナビゲーションメニュー(横三本線)のどちらかに配置しても、ログアウトがメニューに表示されません。
    何か提案はありますか?

    • キャッシュをクリアするか、テーマのサポートに問い合わせて、その特定の問題の最も一般的な原因と解決策を確認してください。

      管理者

  4. ナビゲーションメニューのログアウトリンクをクリックしたときの確認ページで、ページタイトルが「問題が発生しました」となっています。これを変更するにはどうすればよいですか?

  5. 残念ながら、私には機能しません。
    リンクをクリックすると403 Forbiddenエラーが表示され、これはテーマのプラグインによって引き起こされています。回避する方法はないと思いますか?
    ログインとログアウトはできるが、管理バーがないユーザー向けの他の解決策はありますか?

  6. こんにちは…アクション=ログアウト…&リダイレクトをホームページにすることは可能ですか?

    • While we do not have an article on a beginner friendly plugin or method at the moment, we will certainly take a look into that for a future article or update :)

      管理者

  7. ログインがカスタムログインページにリダイレクトされる場合は機能しません。リダイレクトなしでログアウトできるカスタムメニューリンクを作成するにはどうすればよいですか?言い換えれば、ログアウトアドレスに「ログイン」を含めることはできません。

  8. ログアウトリンクの追加に関する素晴らしい記事です。URIがブロックされている場合、htaccess経由でアクションを許可することは可能ですか?

    例えば、私はあなたの「WordPressでIPアドレスによってwp-login.phpファイルへのアクセスを制限する方法」のヒントを使用しています。

    order deny,allow
    Deny from all
    # ホワイトリストIPアドレス
    allow from xx.xxx.xx.xx

    基本的なwp-login.phpへのアクセスを拒否したまま、「wp-login.php?action=logout」を許可することはできますか?また、そのhtaccessコードはどのようになりますか?

  9. または、wp_logout_url()フックを使用してタスクを完了することもできます(上級ユーザー/開発者向け)。

    • function.phpに関数を作成し、ショートコードを追加して、好きな場所で「呼び出す」ことができるようにしました。wp_logout_url(home_url())を使用しましたが、リンクをクリックするたびにログインがスタックし、ホームページにリダイレクトされません。何か提案はありますか?

      postデータのリンクを確認し、postデータが存在する場合(isset($_GET[‘name’]))、指定された関数でユーザーはログアウトします。何か提案はありますか?

      • エラーは発生していますか?以下のようなものであれば、問題なく動作するはずです。

        <a href="”>ログアウト

        • `<a href="”>ログアウト`

          functions.phpに追加した関数を共有していただけますか?

返信する

コメントを残していただきありがとうございます。すべてのコメントは、当社のコメントポリシーに従ってモデレーションされますので、ご了承ください。メールアドレスは公開されません。名前フィールドにキーワードを使用しないでください。個人的で有意義な会話をしましょう。