ワードプレスのグローバルナビゲーションにログインリンクをつける、ログイン後はユーザー名を表示する

ワードプレスのグローバルナビゲーション(トップメニュー)にログインリンクをつけ、かつログイン後はユーザー名を表示する方法をクライアント様の依頼事例からご紹介します。

ワードプレスのグローバルメニューを出力前に置き換える

この機能の実装にはいくつか方法はありますが、管理者の方が管理画面からメニュー等を追加してもこの機能が常に表示されるようにするために、ワードプレスのfinctions.php(wp-contents/themes/お使いのテーマ　フォルダにあるテーマへの機能追加の為のファイルです)にコードを追加して機能を実装しました。

メニューを出力する直前にその文字列を取得して置き換えるフックという機能を利用します。グローバルナビゲーションの出力内容をフックする関数はwp_nav_menuという関数で下記のように記載します。

function addlogin_link($mymenucode) {
	global $current_user;
	wp_get_current_user();

	if (is_user_logged_in()){
		//ユーザーがログインしている場合はメニューにユーザー名を表示する
		return $mymenucode;
	} else {
		//ユーザーがログインしていない場合はログインリンクボタンを表示する
		return $mymenucode;
	}
}

add_filter('wp_nav_menu','addlogin_link');

このコードの$mymenucodeという変数にグローバルナビゲーションの出力前のHTMLコードが入っていますのでこの文字列を置き換えて希望の機能を追加して返還する(return)と、グローバルメニューを改変することが可能です。

ログイン後に現在アクセスしているページにリダイレクトするログインリンクを作成する

ユーザーがログイン画面でログインした後に、ログインボタンを押したページにジャンプするリンクURLを作るには下記のようなコードを利用します。

global $wp;
$current_url = home_url( $wp->request );
$loginlink = wp_login_url($current_url);

$loginlinkという変数に上記URLが代入されます。具体的なURLは下記のような形になります。
http://ワードプレスのURL/wp-login.php?redirect_to=ログイン後のリダイレクト先URL

ログイン中のユーザー名を取得する

ユーザーがログインしている場合はログイン名を表示したいためユーザー名を取得します。ユーザー名を取得するコードは下記のような形となります。

$username = $current_user->display_name;

ワードプレスのグローバルメニューを出力前に置き換えてログインリンクを表示し、ログイン後はユーザー名を表示する

それではこれまで作成したコードを組み合わせて最終的な機能を実装してみます。

function addlogin_link($mymenucode) {
    global $current_user;
    wp_get_current_user();

    if (is_user_logged_in()){
        //ユーザーがログインしている場合はメニューにユーザー名を表示する
        $username = $current_user->display_name;
        return str_replace ('</ul>','<li class="menu-item"><a href="javascript:void(0);">'.$username.' 様</a></li></ul>',$mymenucode);
    } else {
        //ユーザーがログインしていない場合はログインリンクボタンを表示する
        global $wp;
        $current_url = home_url( $wp->request );
        $loginlink = wp_login_url($current_url);
        return str_replace ('</ul>','<li class="menu-item"><a href="'.$loginlink.'">ログイン</a></li></ul>',$mymenucode);
    }
}

add_filter('wp_nav_menu','addlogin_link');

このコードはグローバルナビゲーションの出力前のHTMLコードが入っている$mymenucodeの末端の</ul>を、それぞれユーザーがログインしている場合とログインしていない場合とを分けて、</ul>の直前にログインリンクのコード(もしくはログイン名を表示するコード)を差しはさむ機能を実現しています。

ワードプレスのメニューのカスタマイズやログイン機能の追加はWPドクターにご依頼ください