WordPressの管理画面をカスタマイズする時に使えるハック Part 4

WordPressの管理画面をカスタマイズする時に使えるハック Part 4

また幾つか覚えておきたいことが溜まってきたので、WordPressの管理画面に関するカスタマイズまとめの第4弾です。

functions.phpを使用するので、テーマ内にない場合は作成してください。

※以下で紹介している内容は、WordPress Ver3.9.1で動作確認などしたものです。

WordPressの管理画面をカスタマイズする時に使えるハック Part 4 目次

  1. アドミンバーを非表示にする
  2. ダッシュボードにスクリーンレイアウトを復活させる
  3. 投稿ページに任意の内容でボックスを追加する
  4. 投稿エディタに予めテキストなどを挿入しておく
  5. カスタム投稿のDashiconsを変更する
  6. 各メニューに適用されているDashiconsを変更する
  7. 記事を公開する前に確認アラートを表示する
  8. 固定ページ一覧から指定したページを非表示にする
  9. ログイン時にメールアドレスでもログイン可能にする
  10. デフォルトの管理画面カラーを変更し、ユーザー毎に変更できないようにする

1. アドミンバーを非表示にする

管理者やユーザーがひとりの場合なら「ユーザー → あなたのプロフィール」から設定を一回するだけで済むのでわざわざこの方法を使わなくても良いとは思いますが、管理者が複数いる場合はそれぞれ設定していく必要があるので、手っ取り早く全てのユーザーに対して適用させたい時は、下記をfunctions.phpに記述することで実装できます。

functions.php

add_filter( 'show_admin_bar', '__return_false' );

この方法はCodexで紹介されているものです。

目次へ

2. ダッシュボードにスクリーンレイアウトを復活させる

ダッシュボードにスクリーンレイアウトを復活させる

3.8になってから管理画面デザインが一新され、その際にダッシュボードのウィジェットカラムの表示数を選ぶことができる「スクリーンレイアウト」の設定がなくなりました。
これを復活させたいという場合は下記をfunctions.phpに記述することで復活させることができます。

functions.php

function add_select_dashboard_columns() {
  add_screen_option( 'layout_columns', array( 'max' => 4, 'default' => 2 ) );
}
add_action( 'admin_head-#toc.php', 'add_select_dashboard_columns' );

最大表示数やデフォルトのカラム数を変更したい場合は、maxdefaultの値をそれぞれ変更してください。

目次へ

3. 投稿ページに任意の内容でボックスを追加する

以前書いた「5. 投稿ページに説明文を挿入する - WordPressの管理画面をカスタマイズする時に使えるハック Part 3」ではただのテキストを入れる感じのものでしたが、こちらは「公開」や「カテゴリー」部分と同じような見栄えで追加する方法です。
ただのテキストを表示する時と同様にタイトル下とエディタ下とで表示する方法があり、実装にはそれぞれ下記をfunctions.phpに記述します。

3-1. タイトル下の場合

functions.php

function add_after_title_help( $post_type ) {
  $screen = get_current_screen();
  $edit_post_type = $screen->post_type;
  if ( $edit_post_type != 'post' )
    return;
  ?>
  <div class="after-title-help postbox">
    <h3 class="hndle">After Title Box</h3>
    <div class="inside">
      <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p>
    </div>
  </div>
<?php }
add_action( 'edit_form_after_title', 'add_after_title_help' );

3-2. エディタ下の場合

functions.php

function add_after_editor_help( $post_type ) {
  $screen = get_current_screen();
  $edit_post_type = $screen->post_type;
  if ( $edit_post_type != 'post' )
    return;
  ?>
  <div class="after-editor-help postbox">
    <h3 class="hndle">After Editor Box</h3>
    <div class="inside">
      <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p>
    </div>
  </div>
<?php }
add_action( 'edit_form_after_editor', 'add_after_editor_help' );

それぞれh3 class="hndle"がタイトル部分、div class="inside"の部分がコンテンツ部分に表示される部分になっているので、それぞれ出力したい内容に変更すれば任意の内容でボックスを設置できます。

投稿ページに任意の内容でボックスを追加する

画像は実際に2つとも実装したところをキャプチャしたもので、このようにタイトルしたとエディタ下にそれぞれボックスが追加されているのが確認できます。

3-3. 移動させることが可能なボックスを追加する

先ほどの方法で任意の内容でボックスを追加することができましたが、このボックスは他のものとは違って配置を変えることができないものになります。
必ず目に止まって欲しいような内容であれば、先ほどの動かないタイプのものを配置したほうが良いですが、そうではなく他と同様に配置変更や表示・非表示選択ができるようなボックスを追加したいという場合は、下記をfunctions.phpに記述することで実装できます。

functions.php

function add_original_metabox() {
  add_meta_box( 'original-metabox', 'Original Box', 'add_original_metabox_content', 'post', 'advanced', 'high' );
}
add_action( 'add_meta_boxes', 'add_original_metabox' );

function add_original_metabox_content() {
?>
  <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p>
<?php
}

ボックスのタイトルを変更したい場合はコードのハイライト部分を、内容を変更したい場合はコードでダミーで入れてある「Lorem ipsum dolor sit amet, ...」の箇所をそれぞれ任意のものに変更してください。

目次へ

4. 投稿エディタに予めテキストなどを挿入しておく

毎回同じような文章を書いているとかある程度フォーマットが決まっているという時に便利なカスタマイズで、投稿エディタに予め指定したテキストやHTMLなどを挿入しておくことができる方法です。
実装には下記をfunctions.phpに記述します。

functions.php

add_filter( 'default_content', 'add_default_editor_content', 10, 2 );
function add_default_editor_content( $content ) {
  $content = '<p>default content here...</p>';
  return $content;
}

デフォルトでは新規追加しようとするとエディタにはもちろん何も書かれていない状態だと思いますが、上記を記述することであらかじめエディタ内に<p>default content here...</p>が挿入されているのを確認できます。

投稿タイプ毎に設定したい場合

先ほどの方法で予めエディタにテキストを挿入しておくことができますが、これだと「投稿」「固定ページ」「カスタム投稿」など全ての投稿タイプに適用されます。
共通で良いのであればそのままで良いですが、それぞれ別のものにしたいとか固定ページでは必要ないという場合は、functions.phpへ下記のように記述すれば各投稿タイプ毎に設定できます。

functions.php

add_filter( 'default_content', 'add_default_editor_content', 10, 2 );
function add_default_editor_content( $content, $post ) {
  switch( $post->post_type ) {
    case 'info':
      $content = '<p>info(custom post type) content</p>';
    break;
    case 'page':
      $content = '<p>page default content</p>';
    break;
    default:
      $content = '<p>post default content</p>';
    break;
  }
  return $content;
}

※上記は「info」というカスタム投稿を使用した場合の記述になります。

この方法は以下で紹介されていたものです。

目次へ

5. カスタム投稿のDashiconsを変更する

カスタム投稿タイプをただ追加するだけだと「投稿」と同じピンのようなDashiconsが表示されますが、それを任意のアイコンに変更する方法です。
下記はfunctions.phpを使用して「news」というカスタム投稿を追加したもので、コードのハイライト部分のように記述することで任意のアイコンを表示させることができます。

functions.php

function create_post_type() {
  register_post_type( 'news', array(
    'label' => 'ニュース',
    'public' => true,
    'menu_position' => 5,
    'menu_icon' => 'dashicons-megaphone'
  ));
}
add_action( 'init', 'create_post_type' );

その他どのようなDashiconsが使用できるかは、以下で確認することができます。

また、この方法は以下で紹介されていたものです。

目次へ

6. 各メニューに適用されているDashiconsを変更する

同じくDashiconsを変更するカスタマイズで、各メニューに表示されているアイコンを任意のものに変更する方法です。
変更するには以下のようにして管理画面に<style>を追加し、そこに変更したいメニューのクラスや適用させたいアイコンなどを記述します。
例えば、下記の場合は「ユーザー」のアイコンを任意のものへ変更した場合の記述です。

functions.php

function change_admin_menu_icons() {
  ?>
  <style>
    .dashicons-admin-users:before { content: '\f307';}
  </style>
  <?php
}
add_action( 'admin_head', 'change_admin_menu_icons' );

各メニュー部分にどのようなクラスが指定されているかを確認するのは、ChromeのデベロッパツールやFirefoxのFirebugなどのアドオンを使うのが便利です。
また、上記では他に管理画面の用のCSSを使用していないという想定での記述となるので、既に管理画面用にCSSを記述したり読み込ませているという場合は、そちらに記述する形でももちろん問題ありません。

どのようなDashiconsが使用できるかやコードの確認は、先ほどと同様以下で確認することができます。

目次へ

7. 記事を公開する前に確認アラートを表示する

「下書き保存しようとしたのに間違って公開してしまった!」というのを防ぐために使えるカスタマイズで、「公開」ボタンを押した際に「記事を公開してもいいですか?」というアラートを表示させる方法です。
実装には下記をfunctions.phpに記述します。

functions.php

$confirm_message = '記事を公開してもいいですか?';

function confirm_publish() {
  global $confirm_message;
  echo '<script type="text/javascript"><!--
  var publish = document.getElementById("publish");
  if (publish !== null) publish.onclick = function() {
      return confirm( "'.$confirm_message.'" );
  };
  // --></script>';
}
add_action( 'admin_footer', 'confirm_publish' );

アラートに表示される文言を変更する場合は、コードのハイライト部分を任意で変更してください。

この方法は以下で紹介されていたものです。

目次へ

8. 固定ページ一覧から指定したページを非表示にする

クライアントが固定ページの追加や編集などしないのであれば、予め「固定ページ」のメニュー自体を非表示にしてしまうとか権限を変更したりするのが手っ取り早いですが、そうでない場合で特定の固定ページに関してはいじってほしくないという時に便利な方法です。
下記をfunctions.phpに記述することで固定ページ一覧で指定したページのみを非表示にすることができ、コードのハイライト表示部分で非表示にしたい固定ページのIDを指定します。

functions.php

add_action( 'pre_get_posts' ,'exclude_page' );
function exclude_page( $query ) {
  if( !is_admin() )
    return $query;
  global $pagenow;
  if( 'edit.php' == $pagenow && ( get_query_var('post_type') && 'page' == get_query_var('post_type') ) )
    $query->set( 'post__not_in', array(3,10,18) );
  return $query;
}

この方法は以下で紹介されていたものです。

目次へ

9. ログイン時にメールアドレスでもログイン可能にする

ログイン時にメールアドレスでもログイン可能にする

デフォルトでは管理画面にログインする際は「ユーザー名」と「パスワード」を入力してログインしますが、それを「ユーザー名 または メールアドレス」と「パスワード」というように、メールアドレスでもログイン可能にする方法です。
実装には下記をfunctions.phpに記述します。

functions.php

function login_with_email_address($username) {
  $user = get_user_by('email',$username);
  if ( !empty($user->user_login) )
    $username = $user->user_login;
  return $username;
}
add_action( 'wp_authenticate', 'login_with_email_address' );

function change_username_text($text){
  if ( in_array($GLOBALS['pagenow'], array('wp-login.php')) ) {
    if ( $text == 'ユーザー名' ) {
      $text = 'ユーザー名 or メールアドレス';
    }
  }
  return $text;
}
add_filter( 'gettext', 'change_username_text' );

この方法は以下で紹介されていたものです。

目次へ

10. デフォルトの管理画面カラーを変更し、ユーザー毎に変更できないようにする

デフォルトの管理画面カラー(カラースキーム)はその名の通り「デフォルト」が初期設定として適用されており、ユーザー毎に好みのカラースキームへと変更することもできますが、このデフォルトカラーを任意のカラーに変更して尚且つユーザー毎に変更できないようにする方法です。
実装には下記をfunctions.phpに記述します。

functions.php

add_filter( 'get_user_option_admin_color', 'set_default_admin_color' );
function set_default_admin_color( $result ) {
  return 'blue';
}

上記コードのハイライト部分はスキーム名を指定する箇所になるので、デフォルトで設定したいカラースキーム名に任意で変更してください。
日本語版ののWordPressを使用している場合は各スキーム名は「ライト」や「コーヒー」のよう日本語表記となっていると思うので、英表記がわからないという方は以下(画像で申し訳ないですが)を参考にそれぞれ該当のスキーム名を指定してあげればデフォルトのカラースキームを変更することができます。

デフォルトの管理画面カラーを変更し、ユーザー毎に変更できないようにする

先ほどのコードを記述することでデフォルトのカラースキームを変更して尚且つ全てのユーザーに同じカラースキームを適用させることができるのですが、これだけだとプロフィールにある「管理画面の配色」の項目はそのまま表示されており、実際に変更することはできないのに変更できるような感じに見えてしまいます...。
なので、先ほどの記述に続けて下記をfunctions.phpに記述しておけば「管理画面の配色」の項目は表示されなくなり、ユーザーに配色変更できるという勘違いをさせないようにできます。

functions.php

remove_action( 'admin_color_scheme_picker', 'admin_color_scheme_picker' );

目次へ


以上、WordPressの管理画面をカスタマイズする時に使えるハック Part 4でした。
以前にも今回紹介した以外の管理画面カスタマイズをまとめているので、興味がある方はこちらもご覧になってみてください :)

Close the search window,
please press close button or esc key.