WordPressの管理画面カスタマイズ時に見るチートシート目的のメモです。
いろんな方のブログなんかで紹介されていますし、特に目新しいようなものもないと思いますが、カスタマイズする際にいちいち思い出したり検索するのが面倒なので個人的にまとめました。

紹介している内容は、基本的にWordPress Ver 3.3で実装・確認したものになります。

February 20, 2014 追記

WordPress Ver 3.8になって管理画面がいろいろ変更されたことにより、紹介しているカスタマイズの一部が使用できなくなっている可能性がありますのでご注意ください。

January 6, 2014 追記

April 25, 2013 追記

管理画面のロゴを変更

WordPressのロゴが表示されているデフォルトの管理画面イメージ

WordPressのデフォルトの管理画面左上には、WordPressのロゴが表示されています。
バージョンアップ毎にロゴが小さくなっている感じはしますが、気になる人は気になるだろうし、特にクライアントに納品する場合などは変更しておくと良いと思うのでロゴを任意のものに変更します。
functions.phpに下記を記述して、CSSで上書くことでロゴを変更します。

functions.php
add_action( 'admin_head', 'my_custom_logo' );
function my_custom_logo() {
  echo '<style type="text/css">#wp-admin-bar-wp-logo > .ab-item .ab-icon { background: url('.get_bloginfo('template_directory').'/images/custom-logo.png) no-repeat left top !important; }</style>';
}

上記はimages内にあるcustom-logo.pngというイメージを表示するようになっているので、イメージの置き場所やファイル名が違う場合はこの部分を変更してください。
大きさは20×20pxが丁度良いみたいです。

ロゴ変更後の管理画面イメージ

 

January 6, 2014 追記

Ver 3.8になってから管理画面デザインが変更され、それに伴って上の方法では管理画面のロゴが変更されなくなりました。
具体的にはこういったアイコンは全てアイコンフォントが使用されるようになっており、以前のように単純な背景画像を差し替えるという記述だけでは変更されないようになっています。
なので、新しい管理画面でもアイコンを変更したいという場合は下記で変更ができます。

functions.php
add_action( 'admin_head', 'my_custom_logo' );
function my_custom_logo() {
  echo '<style type="text/css">#wpadminbar #wp-admin-bar-wp-logo > .ab-item .ab-icon:before { content: ""; display: block; width: 18px; height: 18px; background: url('.get_bloginfo('template_directory').'/images/custom-logo.png) no-repeat 0 0;}</style>';
}

以前の方法では.ab-iconに対して背景画像を指定していたものを.ab-icon:beforeに対して指定する形に変更します。
あとは、表示させたいアイコンの幅と高さを指定して、同じく表示させたいアイコン画像を指定してあげることで新しくなった管理画面でもアイコンが表示されます。

ただ、新しい管理画面ではレスポンシブ対応しているため、大きいディスプレイでは問題ありませんがスマートフォンやタブレットといった小さいディスプレイで見ると、このままだと他のアイコンに比べて明らかに小さいアイコンが表示されてしまいます。
なので、この箇所もレスポンシブにしっかり対応させたいという場合は、それ専用の画像を作成したり、アイコンを画像ではなく同じくアイコンフォントで用意するなどの必要があります。

管理画面のロゴを非表示

デフォルトの管理画面バーのイメージ

単純にロゴを変更するだけならさっきの方法で良かったのですが、3.3になってから管理画面がまた少し変わったことにより、画像のようにマウスオンで「WordPressについて」「WordPress.org」というようなメニューが表示されるようになりました。

個人ブログであればここからフォーラムにいけたりと何かと便利なんですが、やっぱりクライアント納品などの場合は微妙な感じです...。
ロゴだけ変更してメニューのみを消す方法なんかもあると思いますが、特にこの部分を残す必要もない場合はいっそのこと非表示にしてしまいます。
下記をfunctions.phpに記述することでロゴの部分を丸々非表示にできます。

functions.php
add_action( 'wp_before_admin_bar_render', 'hide_before_admin_bar_render' );
function hide_before_admin_bar_render() {
  global $wp_admin_bar;
  $wp_admin_bar->remove_menu( 'wp-logo' );
}

カスタマイズ後の管理画面バーのイメージ

管理バーに項目を追加

上では管理バーの項目を非表示にしましたが、逆にこの管理バーに項目を追加する方法です。
例えば、自分のブログだったらよく使うページや自分の他のサイトへのリンクを置いておいたり、クライアント納品の場合は「ヘルプ」の項目を作ってあげて、「お問い合わせ」とか「使い方」へ誘導してあげたり、上手く使えば何かと便利そうです。

今回はサンプルとして、管理バーに関連サイトの項目を追加してみます。
下記をfunctions.phpに記述してください。

functions.php
class add_related_menu {
  function add_related_menu() {
    add_action('wp_before_admin_bar_render', array($this, "related_links"));
  }

  function add_root_menu($name, $id, $href = FALSE) {
    global $wp_admin_bar;
    if ( !is_super_admin() || !is_admin_bar_showing() )
      return;

    $wp_admin_bar->add_menu( array(
      'id' => $id,
      'title' => $name,
      'href' => $href
    ) );
  }

  function add_sub_menu($name, $link, $root_menu, $meta = FALSE) {
    global $wp_admin_bar;
    if ( !is_super_admin() || !is_admin_bar_showing() )
      return;

    $wp_admin_bar->add_menu( array(
      'parent' => $root_menu,
      'title' => $name,
      'href' => $link,
      'meta' => $meta
    ) );
  }

  function related_links() {
    $this->add_root_menu( '関連サイト', 'related' );
    $this->add_sub_menu( '関連サイトA', 'http://example-a.com', 'related' );
    $this->add_sub_menu( '関連サイトB', 'http://example-b.com', 'related' );
    $this->add_sub_menu( '関連サイトC', 'http://example-c.com', 'related' );
  }
}

add_action( 'init', 'add_related_menu_init' );
function add_related_menu_init() {
  global $add_related_menu;
  $add_related_menu = new add_related_menu();
}

上記を記述することでイメージのように「関連サイト」という項目が追加され、ホバーで「関連サイトA」「関連サイトB」「関連サイトC」というリンクがサブメニューとして表示されるようになります。

カスタマイズ後の管理バーイメージ #1

「関連サイト」という項目名を変更したい場合は上記コードの34行目、ホバーで表示されるメニューのリンクや項目名を変更したい場合は35~37行目あたりを変更してください。
また、項目名のみでサブメニューを表示する必要がない場合は下記のように記述します。

functions.php
add_action( 'wp_before_admin_bar_render', 'add_new_item_in_admin_bar' );
function add_new_item_in_admin_bar() {
  global $wp_admin_bar;
  $wp_admin_bar->add_menu( array(
    'id' => 'new_item_in_admin_bar',
    'title' => __('ここにタイトル'),
    'href' => 'URL'
  ) );
}

カスタマイズ後の管理バーイメージ #2

管理画面のファビコンを変更

管理画面のファビコン変更後のイメージ

管理画面のファビコンを変更する方法です。
サイトと同じにしても良いし、管理画面は違うものにしてわかりやすくしても良いですね。
下記をfunctions.phpに記述し、イメージの置き場所やファイル名が違う場合は変更してください。

functions.php
add_action( 'admin_head', 'admin_favicon' );
function admin_favicon() {
  echo '<link rel="shortcut icon" type="image/x-icon" href="'.get_bloginfo('template_url').'/images/favicon.ico" />';
}

フッターの文字を変更

管理画面のフッター文字変更後のイメージ

フッターに表示されている「WordPress のご利用ありがとうございます。」の文字を変更する方法です。
下記をfunctions.phpに記述し、表示される内容はechoの部分で変更できます。

functions.php
add_filter( 'admin_footer_text', 'remove_footer_admin' );
function remove_footer_admin () {
  echo 'ここに表示したい文字列を入力する。 <a href="URL">リンクも設定できます。</a>';
}

アップデート通知を消す

アップデート通知のイメージ

WordPressはアップデートがあると管理画面上部にアップデート通知が表示されます。
もちろんこれ自体は良い機能だと思うのですが、例えば何らかの理由でやむなくコアファイルをがっつりカスタマイズしたようなサイトをクライアントに納品した際、ここをポチっと押されると大変なことになってしまいます...。
クライアントにアップデートしないよう念を押していたのにされてしまい、結果復旧するのに苦労した話なんかもたまに耳にするので、そういったことが起こらないためにもアップデート通知を非表示にします。

functions.php
add_filter( 'pre_site_transient_update_core', '__return_zero' );
remove_action( 'wp_version_check', 'wp_version_check' );
remove_action( 'admin_init', '_maybe_update_core' );

プラグインのアップデート通知を消す

プラグインのアップデート通知のイメージ

プラグインもイメージのようにサイドバーにアップデートできるプラグインの数が表示されます。
こちらも先程と同様にアップデートされては困るものもあると思うので更新通知を非表示にします。

functions.php
add_action( 'admin_menu', 'remove_counts' );
function remove_counts() {
  global $menu,$submenu;
  $menu[65][0] = 'プラグイン';
  $submenu['index.php'][10][0] = '更新';
}

プラグインのアップデート通知が消えたイメージ

管理バーのアップデート通知を消す

管理バーのアップデート通知のイメージ

上でコアとプラグインのアップデート通知を消したように見えますが、管理バーにも更新通知のアイコンがあります。
これは「2. 管理画面のロゴを非表示」紹介した方法を用いて、下記をfunctions.phpに記述して非表示にします。

functions.php
add_action( 'wp_before_admin_bar_render', 'hide_before_admin_bar_render' );
function hide_before_admin_bar_render() {
  global $wp_admin_bar;
  $wp_admin_bar->remove_menu( 'updates' );
}

ちなみに他の項目を非表示にしたい場合は、$wp_admin_bar->remove_menu( ‘xxx’ );xxxの部分をそれぞれ下記に変更していけば非表示にできます。

  • サイト名: site-name
  • コメント: comments
  • 新規追加: new-content

ダッシュボードにウィジェットを追加

ダッシュボードに表示されている「現在の状況」「最近のコメント」といったようなウィジェットを追加する方法です。 下記をfunctions.phpに記述してください。

functions.php
function dashboard_widget_function() {
  echo 'ここにウィジェットの内容';
}

add_action( 'wp_dashboard_setup', 'add_dashboard_widgets' );
function add_dashboard_widgets() {
  wp_add_dashboard_widget( 'dashboard_widget', 'ウィジェットタイトル', 'dashboard_widget_function' );
}

追加したオリジナルウィジェットのイメージ

記述後、イメージのようにオリジナルのウィジェットを追加することができます。
タイトルを変更したい場合は7行目、中身を変更したい場合は2行目を変更してください。
iframeとかも使えるみたいですし、例えば複数人で管理しているようなサイトであればお知らせを表示しておいたりと使い方によっては便利なカスタマイズだと思います。

ダッシュボードのウィジェットを非表示

上ではウィジェットを追加しましたが、今度は逆にウィジェットを非表示にする方法です。
右上にある「表示オプション」で表示・非表示の切り替えはできますが、クライアント納品の場合は「プラグイン」や「WordPressブログ」などの項目は恐らく必要ないと思うので、functions.phpを使ってウィジェットと「表示オプション」内の項目を非表示にします。

functions.php
add_action( 'wp_dashboard_setup', 'remove_dashboard_widgets' );
function remove_dashboard_widgets() {
  global $wp_meta_boxes;
  unset($wp_meta_boxes['dashboard']['normal']['core']['dashboard_right_now']);        // 現在の状況
  unset($wp_meta_boxes['dashboard']['normal']['core']['dashboard_recent_comments']);  // 最近のコメント
  unset($wp_meta_boxes['dashboard']['normal']['core']['dashboard_incoming_links']);   // 被リンク
  unset($wp_meta_boxes['dashboard']['normal']['core']['dashboard_plugins']);          // プラグイン
  unset($wp_meta_boxes['dashboard']['side']['core']['dashboard_quick_press']);        // クイック投稿
  unset($wp_meta_boxes['dashboard']['side']['core']['dashboard_recent_drafts']);      // 最近の下書き
  unset($wp_meta_boxes['dashboard']['side']['core']['dashboard_primary']);            // WordPressブログ
  unset($wp_meta_boxes['dashboard']['side']['core']['dashboard_secondary']);          // WordPressフォーラム
}

ダッシュボードのデフォルトウィジェットを非表示にした表示オプションのイメージ

イメージは全部のウィジェットを非表示にして、先程追加したオリジナルのウィジェットのみが表示されている状態で、このように「表示オプション」からも各項目がなくなっているのがわかります。

ただ、Ver 3.3で新しく追加された「ようこそ」は上記を使用しても消すことができないので、どうしても不要な場合はCSSで無理矢理消すなどすることになります。

April 25, 2013 追記

Ver 3.3のときは消すことができなかった「ようこそ」ですが、下記のコードでVer 3.5から消せるようになりました。

functions.php
remove_action( 'welcome_panel', 'wp_welcome_panel' );

WordPressの管理画面カスタマイズについては以下エントリーでもまとめています。