エンジニア足立のコーディング日記

先日お客様から、

「WordPressの管理画面から別のサイトへ移動できるようにリンクを貼って欲しいんだけど」

というご相談を頂きました。

以前一度同じ様な事をやったので、当然出来ます！！

との返答をしたのですが、

以前行った作業内容を覚えていないので、

もう一度方法から調べ直しです。

なので、今回はちゃんと記録を残しておくことに。

やりたいことは、
WordPress管理画面上部のメニューバーの部分に、お客様から指示を頂いたURLへのリンクメニューを追加するだけです。

function add_link_other_site( $wp_admin_bar ) {
    if (is_user_logged_in() ){
        $wp_admin_bar->add_node(array(
        'id'    => 'yahoolink',
        'title' => 'Yahoo',
        'href'  => 'http://www.yahoo.co.jp/'
        ));
    }
}
add_action('admin_bar_menu', 'add_link_other_site', 100);

こんな感じで、メニューバーに表示されます。

さらに、Googleへリンクも貼りたい場合には、

function add_link_other_site( $wp_admin_bar ) {
    if (is_user_logged_in() ){
        $wp_admin_bar->add_node(array(
        'id'    => 'yahoolink',
        'title' => 'Yahoo',
        'href'  => 'http://www.yahoo.co.jp/'
        ));
        $wp_admin_bar->add_node(array(
        'id'    => 'googlelink',
        'title' => 'Google',
        'href'  => 'http://www.google.co.jp/'
        ));
    }
}
add_action('admin_bar_menu', 'add_link_other_site', 100);

こんな感じで、メニューバーにGoogleへのリンクが追加されます。

簡単ですね！！

ただ、

これだとリンクをクリックした際には同一画面で遷移してしまい、

個人的には非常に使いづらく感じてしまいます。

そこで、以下のコードも追加することで、

別画面（target="_blank"）遷移するようにしてやります。

function add_link_target_blank() {
    if (is_user_logged_in() ){
print<<<EOF
    <script type="text/javascript">
        jQuery(function($) {
            $('#wp-admin-bar-yahoolink a').attr('target', '_blank');
            $('#wp-admin-bar-googlelink a').attr('target', '_blank');
        });
    </script>
EOF;
    }
}
add_action( 'admin_head', 'add_link_target_blank' );

add_link_other_site()の関数の中で、

それぞれ、

「yahoolink」「googlelink」というIDを設定しているので、

>> $('#wp-admin-bar-yahoolink a').attr('target', '_blank');
>> $('#wp-admin-bar-googlelink a').attr('target', '_blank');
のコードを追加することで、

それぞれの<a>タグに「target="_blank"」という属性を追加するイメージです。