WordPressの管理画面カスタマイズ時に見るチートシート目的のメモ第4弾です。

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

メディアアップローダのデフォルト表示を変更する

画像を追加したい時には投稿画面にある「メディアを追加」ボタンから行う人が多いと思いますが、その際にデフォルトのメディアアップローダでは「すべてのメディア」が初期選択された状態になっています。
例えば画像を多用しているサイトなどで不要な画像はできるだけ非表示にしたい時やロードさせたくない時などは、デフォルトで「すべてのメディア」となっているプルダウンを「この投稿へのアップロード」に変更することで表示されるメディアを絞り込んで表示させることができるのですが、これを毎回選択するのが面倒だとかデフォルトの初期選択を変えたいという場合はfunctions.phpへ下記のように記述することで変更することができます。

functions.php
add_action( 'admin_footer-post-new.php', 'change_media_uploader_default_filters' );
add_action( 'admin_footer-post.php', 'change_media_uploader_default_filters' );
function change_media_uploader_default_filters() {
?>
<script type="text/javascript">
jQuery(function($) {
  wp.media.view.Modal.prototype.on('open', function() {
    $('#media-attachment-filters > [value="uploaded"]').prop('selected', true).parent().trigger('change');
  });
});
</script>
<?php
}

見ての通りですが、jQueryを用いてメディアアップローダ表示時にプルダウンの選択が変更されるように記述することで初期選択されているようにしています。
上記はプルダウンの初期選択を「この投稿へのアップロード」に変更するものになりますが、これを「画像」や「未添付」など他のものに変更したいというときはコードの[value="uploaded"]部分をそれぞれ下記のように記述することで変更可能です。

  • 「画像」 → [value="image"]
  • 「音声」 → [value="audio"]
  • 「動画」 → [value="video"]
  • 「未添付」 → [value="unattached"]

メディアアップローダの表示「この投稿へのアップロード」のみにする

先ほどのものは初期選択を変更しただけなので他の絞り込み内容に変更することができましたが、こちらはいっそのこと必要ない他のプルダウンは全て消してしまうという方法になります。
実装にはfunctions.phpへ下記のように記述し、この場合は記述後に画面を確認するとプルダウンの内容が「この投稿へのアップロード」のみになっているのを確認できます。

functions.php
add_action( 'admin_footer-post-new.php', 'change_media_uploader_filters' );
add_action( 'admin_footer-post.php', 'change_media_uploader_filters' );
function change_media_uploader_filters() {
?>
<script type="text/javascript">
jQuery(document).on('DOMNodeInserted', function() {
  jQuery('select.attachment-filters [value="uploaded"]').prop('selected', true).siblings().hide().parent().trigger('change');
});
</script>
<?php
}

ここでは「この投稿へのアップロード」を例にしましたが、他のものにしたい場合は先ほどと同様で[value="uploaded"]の部分を任意のものに変更すれば実装できます。

メディアアップローダの初期表示タブを変更する

メディアアップローダを立ち上げるとデフォルトでは「メディアライブラリ」のタブが選択された状態で表示されますが、それを初期表示で「ファイルをアップロード」の方が選択された状態で表示されるようにする方法です。
実装にはfunctions.phpへ下記のように記述し、上2つと同様にjQueryを利用する形で実装をします。

functions.php
add_action( 'admin_footer-post-new.php', 'change_media_uploader_default_router' );
add_action( 'admin_footer-post.php', 'change_media_uploader_default_router' );
function change_media_uploader_default_router() {
?>
<script type="text/javascript">
jQuery(function($) {
  // 「メディアを挿入」の初期表示タブを「ファイルをアップロード」に
  wp.media.controller.Library.prototype.defaults.contentUserSetting = false;
  // 「アイキャッチ画像」の初期表示タブを「ファイルをアップロード」に
  wp.media.controller.FeaturedImage.prototype.defaults.contentUserSetting = false;
});
</script>
<?php
}

ここでは「メディアを挿入」と「アイキャッチ画像」ともに初期表示タブを変更しましたが、アイキャッチに関してはこの初期表示の動きは必要ないということであれば、wp.media.controller.FeaturedImage.prototype.defaults.contentUserSetting = false;の記述を消してください。

「ヘルプ」タブを非表示にする

「ヘルプ」タブのイメージ

管理画面右上にある「ヘルプ」タブを非表示にする方法です。
本来はそのページの使い方や機能について書かれているので便利なものではあるのですが、例えば何らかの理由でデフォルトの機能などを取り除いており、ほとんどヘルプとして役割を果たしていないときや単純にとにかく管理画面をシンプルにしたいというときなどに使えると思います。

実装にはfunctions.phpへ下記のように記述します。

functions.php
add_action( 'admin_head', 'remove_help_tabs' );
function remove_help_tabs() {
  $screen = get_current_screen();
  $screen -> remove_help_tabs();
}

または既に管理画面用で自前のCSSを記述している(読み込んでいる)場合は、下記のようにCSSを利用して非表示にさせることもできます。

functions.php
add_action( 'admin_head', 'remove_help_tabs' );
function remove_help_tabs() {
?>
<style type="text/css">
  #contextual-help-link-wrap {
    display: none !important;
  }
</style>
<?php
}

上記をそのまま使用した場合はいずれも全てのページで「ヘルプ」が非表示になりますが、admin_headの箇所を変更したりスタイル指定にbodyのclassを利用するなどすれば、特定のページでのみ非表示にさせるということもできます。

ちなみに、「表示オプション」が不要な場合は以下の方法で非表示にすることができます。

投稿フォーマットのラベル名を変更する

投稿フォーマットの一覧イメージ

投稿フォーマットを使うことで様々なデザインやレイアウトに見せることが可能になりますが、例えば「アサイド」や「ステータス」のようにフォーマット名が人によって少しわかりづらいものもあります。
それをfunctions.phpへ下記のように記述することでフォーマットのラベル名を任意の名前にできます。

functions.php
add_filter( 'gettext_with_context', 'rename_post_formats' );
function rename_post_formats( $text ) {
  if ( $text == 'アサイド' )
    return '「アサイド」のフォーマット名を変更';
  if ( $text == '画像' )
    return '「画像」のフォーマット名を変更';
  if ( $text == '動画' )
    return '「動画」のフォーマット名を変更';
  if ( $text == '引用' )
    return '「引用」のフォーマット名を変更';
  if ( $text == 'リンク' )
    return '「リンク」のフォーマット名を変更';
  if ( $text == 'ギャラリー' )
    return '「ギャラリー」のフォーマット名を変更';
  if ( $text == 'ステータス' )
    return '「ステータス」のフォーマット名を変更';
  if ( $text == '音声' )
    return '「音声」のフォーマット名を変更';
  if ( $text == 'チャット' )
    return '「チャット」のフォーマット名を変更';
  return $text;
}

「投稿」のラベル名を変更する

「投稿」のラベル名を変更したイメージ

カスタム投稿を利用する際は更新する内容に応じてそれっぽいラベル名(投稿名)にあらかじめすることが多いと思いますが、デフォルトで用意されている「投稿」のみを利用するという時に「投稿」だとちょっとわかりづらいなと感じる場合は、functions.phpへ下記のように記述することで「投稿」というラベル名を任意のものに変更することができます。

functions.php
function change_post_menu_label() {
  global $menu;
  global $submenu;
  $menu[5][0] = 'お知らせ';
  $submenu['edit.php'][5][0] = 'お知らせ一覧';
  $submenu['edit.php'][10][0] = '新しいお知らせを追加';
}
add_action( 'init', 'change_post_label' );
function change_post_label() {
  global $wp_post_types;
  $labels = $wp_post_types['post'] -> labels;
  $labels->name = 'お知らせ';
  $labels->singular_name = 'お知らせ';
  $labels->add_new = '新しいお知らせ';
  $labels->add_new_item = '新しいお知らせを追加';
  $labels->edit_item = 'お知らせの編集';
  $labels->new_item = '新しいお知らせ';
  $labels->view_item = 'お知らせを表示';
  $labels->search_items = 'お知らせを検索';
  $labels->not_found = 'お知らせが見つかりませんでした';
  $labels->not_found_in_trash = 'ゴミ箱のお知らせにも見つかりませんでした';
}

今回は例として「投稿」を全て「お知らせ」に変更してみたもので、上記記述後に管理画面を確認すると各箇所で「投稿」と表示されていたところが「お知らせ」になっているのを確認できます。

管理画面内の文言をわかりやすいものに変更する

例えば「アイキャッチ画像」や「メディア」など、普段からWordPressを触っているという人や一度説明を受ければすぐ理解できるような人はそれらがどのようなものなのかすぐわかるとは思いますが、特にそういった呼び方に慣れていない人や忘れっぽい人など更新者によってはわかりづらい文言になっている箇所があります。
それらをもっとわかりやすい文言にしたいときにはfunctions.phpへ下記のように記述することで任意の文言に変更することができ、下記の場合は先ほど例に挙げた「アイキャッチ画像」が「サムネイル画像」に、「メディア」が「画像」という文言にそれぞれ変更されます。

functions.php
add_filter( 'gettext', 'change_side_text' );
function change_side_text( $translated ) {
  $translated = str_ireplace( 'アイキャッチ画像', 'サムネイル画像', $translated );
  $translated = str_ireplace( 'メディア', '画像', $translated );
  return $translated;
}

「アイキャッチ画像」部分に補足テキストを表示する

先ほど「アイキャッチ画像」という名前をわかりやすいものに変更する方法を紹介しましたが、こちらも更新者に少しでもわかりやすくしたいときに使えるカスタマイズです。
functions.phpに下記のように記述することで、アイキャッチ画像部分に補足テキストを表示させることができます。

functions.php
add_filter( 'admin_post_thumbnail_html', 'add_post_thumbnail_description' );
function add_post_thumbnail_description( $content ) {
  return $content .= '<p>Lorem ipsum dolor sit amet.</p>';
}

「アイキャッチ画像」部分に補足テキストを表示したイメージ

このようにテキストを表示させることでき、イメージのようにスタイルを適用して目立たせるといったことも可能です。

管理バーにログアウトを追加する

管理バーにログアウトを追加したイメージ

デフォルトの管理画面ではページ右上にあるプロフィールを展開すると表示される部分にログアウトがあるのですが、初めてWordPressの管理画面を見たという人からするとパッと見でどこにあるのかがわかりづらいです...。
それをfunctions.phpに下記のように記述することで管理バーにログアウトを作成し、ここからログアウトできるということをわかりやすくできるカスタマイズです。

functions.php
add_action( 'wp_before_admin_bar_render', 'add_custom_logout_in_admin_bar' );
function add_custom_logout_in_admin_bar() {
  global $wp_admin_bar;
  $wp_admin_bar->add_menu(array(
    'id'    => 'custom-logout',
    'title' => 'ログアウト',
    'href'  => wp_logout_url()
  ));
}

上記を記述するだけだと「ログアウト」というテキストのみが表示される形になりますが、他の項目と同じようにアイコンをつけたい時はCSSを利用すれば任意のアイコンをつけることも可能です。
上記記述をそのまま使用した場合は、ボタンを括っているli要素に#wp-admin-bar-custom-logoutというidが付加されていると思うので、そのidを利用する形で記述すればアイコンをつけられます。

ちなみに、他の項目と同じように<span class="ab-icon"></span><span class="ab-label"></span>がある状態で実装したい場合は、先ほどのものを下記に置き換えてもらえれば実装できます。

functions.php
add_action( 'wp_before_admin_bar_render', 'add_custom_logout_in_admin_bar' );
function add_custom_logout_in_admin_bar() {
  global $wp_admin_bar;
  $wp_admin_bar->add_menu(array(
    'id'    => 'custom-logout',
    'title' => '<span class="ab-icon"></span><span class="ab-label">ログアウト</span>',
    'href'  => wp_logout_url()
  ));
}

ログアウト後に任意のページの移動させる

デフォルトではログアウトした際はログイン画面に移動しますが、functions.phpに下記のように記述することでログアウト後に任意のページに移動させることができます。
この場合はログアウト後にトップページに移動する動きになるので、他のページを指定したい場合はhome_url()の部分を変更してください。

functions.php
add_filter( 'logout_redirect', 'custom_logout_redirect' );
function custom_logout_redirect( $redirect_to ) {
  $redirect_to = home_url();
  return $redirect_to;
}

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