WordPress管理画面をカスタマイズして使いやすくする

WordPressの管理画面をカスタマイズする方法メモです。

デフォルトの内容以外にもっとこの表示があるといいのに…と思うこともあれば、このメニューや機能はいらないかな…と思うこともあります。
WordPressの操作に慣れていない人にやさしい画面設定をしたり、そうでなくてもより使いやすいものにすると作業がスムーズに進むと思います。

どういったことが編集できるか分かっているだけでも自分が必要・不要なものを追加・削除したり、案件で依頼があった時にも対応しやすいはず。カスタマイズ方法を知って管理画面を使いやすくしていきましょう。

以下の内容はWordPressバージョン6.1.1にて確認しています。

ログインユーザーの権限による条件分岐

WordPressではログインするユーザーの権限がいくつか設けられています。
不要なものを表示させないようにしたり、変更できないようにするために設定するのがユーザー権限です。

何人かでサイトを運営する場合や、運営者ではないユーザーもログインができるようになっているサイトの場合、アクセスしてほしくないところや見られたくない項目などが出てくると思います。

複数人が管理画面にアクセスできる状態でみんなが自由に機能を変更できてしまうと意図しなくともトラブルが発生してしまうことがあります。

そこでどの権限を持っているユーザーかによって設定の振り分けをする必要があります。この時にどのようにして条件分岐ができるかおさえておくとスムーズに実装できます。

権限名称
管理者
全ての機能にアクセス可能
administrator
編集者
全ての投稿の更新が可能
editor
投稿者
投稿の作成、自身が書いた記事の編集が可能
author
寄稿者
下書きと編集のみ可能
contributor
購読者
サイトの閲覧のみ可能
subscriber
if (current_user_can('権限名')){
  // 対象の権限ユーザーに対して設定する内容
}
if (!current_user_can('権限名')){
  // 対象以外の権限ユーザーに対して設定する内容
}

ツールバー(アドミンバー)の非表示

WordPressにログインしている時に最上部に表示されるところは、ツールバー・アドミンバー・管理バーなどと呼ばれています。
このバーはWordPressの各編集画面にワンクリックでとべるので便利なのですが、サイト確認の際には無くしたい時もあります。

ツールバーはユーザーのプロフィールページから変更できます。
【ユーザー > プロフィール】 の「ツールバー」という項目で「サイトを見る時にツールバーを表示する」のチェックを外します。

ユーザープロフィール画面

チェックを外して「プロフィールを更新」ボタンを押して保存するとバーが消えます。

functions.php に以下のように記述しても非表示になります。表示させるときはコメントアウトすればOK。

add_filter('show_admin_bar', '__return_false');

WordPressログインページカスタマイズ

ロゴや背景、フォーム部分などログインページをサイト専用にカスタマイズしておくと、目当てのサイトであることが視覚的に分かりやすくなります。
特に複数サイトを運用している場合は、ログイン情報入力前にぱっと見で何のサイトのログイン画面か判断できるのでメリットになると思います。

読み込ませたいスタイルを記述、もしくはログインページ用のCSSファイルをログインページが表示された時に読み込ませる、というコードを functions.php に記載します。基本の記述方法は以下の形です。

【関数内でスタイルを直接当てる場合】

function login_style_custom() {
  echo '<style>
    // ログインページで変更・追加したいスタイルを設定
  </style>';
}
add_action('login_head', 'login_style_custom');

【ログインページ用のCSSファイルを作成する場合】

function login_style_custom() {
  echo '<link rel="stylesheet" href="'.get_template_directory_uri().'/css/admin_login.css" />';
  }
add_action('login_head', 'login_style_custom');

ログイン画面に表示されるコンテンツにどんなスタイルが当たっているかはデベロッパーツールから確認できます。どの要素にどういったスタイルが当たっているかを参考にしながら上書きします。

管理画面専用のCSSを設定してスタイルを変更

管理画面のスタイル(デザイン)を変更したいこともあります。そんなときは管理画面専用のcssファイルを作成し、functions.php に以下のように追加します。

// 管理画面用のcss
function custom_admin_style() {
  echo '<link rel="stylesheet" type="text/css" href="'.get_template_directory_uri().'/css/admin_custom.css" />';
}
add_action('admin_head', 'custom_admin_style');

これで admin_custom.css に記述したスタイルが管理画面に反映されるようになります。

先述したログインページ用の変更と同じような記述ですが、add_action() の指定が admin_head になるので、ログインページとは別に記述する必要があります。

管理画面の左側に表示されるメニューのカスタマイズも可能です。

あっても使わないものはない方がすっきりしますし、余計な項目はない方が使いやすいです。
またあまり知識のない人が、重要なところをうっかり変更して問題が出てしまった…なんていうことを未然に防ぐこともできます。

デフォルトのメニューの他、独自にメニューを追加することもできます。

記事やカテゴリーの並び順変更

管理画面での記事やカテゴリーの並び順はデフォルトではID順になっています。この並び順を変更することもできます。

「Intuitive Custom Post Order」というプラグインで簡単に変更することができるのでおすすめです。

投稿画面で不要な項目を非表示にする

投稿画面で使わない入力項目はないでしょうか?入力するときに迷わない一番の方法は非表示にすること。「入力間違いを少なくする」ことにも効果的です。

remove_post_type_support() で非表示

Gutenberg の投稿画面の項目非表示には remove_post_type_support() を使用します。
カテゴリーとタグは unregister_taxonomy_for_object_type() を使います。

function remove_post_support() {
  remove_post_type_support('post','title'); // タイトル
  remove_post_type_support('post','editor'); // 本文
  remove_post_type_support('post','author'); // 作成者
  remove_post_type_support('post','thumbnail'); // アイキャッチ画像
  remove_post_type_support('post','excerpt'); // 抜粋
  remove_post_type_support('post','trackbacks'); // トラックバック
  remove_post_type_support('post','custom-fields'); // カスタムフィールド
  remove_post_type_support('post','tag'); // コメント
  remove_post_type_support('post','comments');  // コメント
  remove_post_type_support('post','revisions'); // リビジョン
  remove_post_type_support('post','page-attributes'); // 表示順
  remove_post_type_support('post','post-formats'); // 投稿フォーマット
  unregister_taxonomy_for_object_type('category', 'post'); // カテゴリー
  unregister_taxonomy_for_object_type('post_tag', 'post'); // タグ
}
add_action('init','remove_post_support');

本文を非表示にすると Gutenberg の設定にしていてもクラシックエディターみたいな表示になります。(バグではない)

カスタムフィールドだけで入力するなら本文なしでもいいと思います。以下はカスタムフィールドだけを表示させている状態のものです。

Gutenbergでは remove_meta_box() が動作しない

クラシックエディターの時に使われていた項目非表示コード remove_meta_box() は Gutenberg では動作しませんでした。

function remove_post_meta_boxes() {
  // 投稿
  remove_meta_box('categorydiv','post','side'); // カテゴリー
  remove_meta_box('postcustom', 'post', 'normal'); // カスタムフィールド
  remove_meta_box('postexcerpt', 'post', 'normal'); // 抜粋
  remove_meta_box('commentsdiv', 'post', 'normal'); // コメント
  remove_meta_box('tagsdiv-post_tag', 'post', 'side'); // タグ
  remove_meta_box('trackbacksdiv', 'post', 'normal'); // トラックバック
  remove_meta_box('commentstatusdiv', 'post', 'normal'); // ディスカッション
  remove_meta_box('slugdiv','post','normal'); // スラッグ
  remove_meta_box('authordiv','post','normal'); // 作成者
  remove_meta_box('revisionsdiv','post','normal'); // リビジョン
  // 固定ページ
  remove_meta_box('postcustom', 'page', 'normal'); // カスタムフィールド
  remove_meta_box('postexcerpt', 'page', 'normal'); // 抜粋
  remove_meta_box('commentsdiv', 'page', 'normal'); // コメント
  remove_meta_box('tagsdiv-post_tag', 'page', 'side'); // タグ
  remove_meta_box('trackbacksdiv', 'page', 'normal'); // トラックバック
  remove_meta_box('commentstatusdiv', 'page', 'normal'); // ディスカッション
  remove_meta_box('slugdiv', 'page', 'normal'); // スラッグ
  remove_meta_box('authordiv', 'page', 'normal'); // 作成者
  remove_meta_box('revisionsdiv', 'page', 'normal'); // リビジョン
  remove_meta_box('pageparentdiv', 'page', 'side'); // ページ属性
}
add_action('admin_menu', 'remove_post_meta_boxes');

上記のようなコードを書いていて、設定しているのに非表示にならない!という時は、remove_post_type_support のコードに変更してみてください。
「remove_post_type_support() で非表示」に戻る

ダッシュボードのカスタマイズ

ダッシュボードは管理画面のトップページのようなもので、このページにはさまざまなウィジェットが表示されます。デフォルトの状態ではあまり見ない情報も表示されているのではないでしょうか。

不要な表示をなくしてスッキリさせたり、表示内容を追加することでより使いやすいダッシュボードにすることができます。

ダッシュボードで不要なウィジェットを非表示にする

普段使用しないもの、なくても困らないものは非表示でも問題ないでしょう。
ダッシュボード画面の「表示オプション」からチェックを外すと、即時非表示になります。

ダッシュボード画面
表示オプションを開いた状態
表示オプションのチェックをいくつか外した状態

ここの表示オプションから表示できるようにしたくない場合は、functions.php で表示を削除するコードを記述します。

function remove_dashboard() {
  remove_action('welcome_panel', 'wp_welcome_panel'); // 「WordPressへようこそ」のパネル
  remove_meta_box('dashboard_right_now', 'dashboard', 'normal'); // 概要
  remove_meta_box('dashboard_activity', 'dashboard', 'normal'); // アクティビティ
  remove_meta_box('dashboard_quick_press', 'dashboard', 'side'); // クイックドラフト
  remove_meta_box('dashboard_primary', 'dashboard', 'side'); // WordPress イベントとニュース
  remove_meta_box('dashboard_site_health', 'dashboard', 'normal'); // サイトヘルスステータス
}
add_action('wp_dashboard_setup', 'remove_dashboard');

この記述でダッシュボード、表示オプションともに表示されなくなります。

ダッシュボードの項目を全て削除した状態

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

ダッシュボードにウィジェットを追加することもできます。
管理画面を見る人たちへのお知らせや、テーマの使い方・注意事項を載せたりとアイデア次第でいろいろな用途に使えます。

function add_dashboard_widgets() {
  wp_add_dashboard_widget(
    'example_dashboard_widget',
    'タイトルを入力',
    'ex_dashboard_widget_function'
  );
}
function ex_dashboard_widget_function() {
  echo '
  <h1>このWordPressの使い方</h1>
  <p>ワードプレスはこのように使います</p>
  <ul>
    <li>・使い方リスト</li>
    <li>・使い方リスト</li>
    <li>・使い方リスト</li>
  </ul>
  ';
}
add_action('wp_dashboard_setup', 'add_dashboard_widgets');

wp_add_dashboard_widgets() で追加するウィジェットを登録。ex_dashboard_widget_function() は表示するコンテンツを設定します。
登録すれば表示オプションにも表示されます。

追加したウィジェットのみ表示

バージョンのアップデート喚起「今すぐ更新してください」を非表示にする

WordPressが最新バージョンでない場合、以下のように「WordPress *** が利用可能です!今くす更新してください」という表示がされるようになっています。

もし、誰かがこれを見て「更新しなきゃいけないんだな」と思ってクリックしてしまったらサイトに問題が発生…ということもあり得ますよね。またクライアントが更新されていないことを不安に思ってしまうこともあります。
そういった状況を避けたい場合、この表示を非表示にすることができます。

function no_update_notice() {
  remove_action('admin_notices', 'update_nag', 3);
}
add_action('admin_init', 'no_update_notice');

管理ユーザーには表示させてもいいという場合は、管理者以外には表示させないという条件分岐をつけます。

function no_update_notice() {
  if (!current_user_can('administrator')) {
    remove_action('admin_notices', 'update_nag', 3);
  }
}
add_action('admin_init', 'no_update_notice');

プラグインのアップデート表示もなしにする

ダッシュボードでの喚起表示が無くなっても「更新」の部分が見れる状態であればそちらから新しいバージョンがあることはわかります。
またこの「更新」ページではプラグインのアップデートがあるかどうかも分かります。非表示にしたい場合はこの項目ごと非表示にする必要があります。

function custom_admin_menu() {
  remove_submenu_page('index.php', 'update-core.php'); // 更新
}
add_action('admin_menu', 'custom_admin_menu');

この項目も削除してダッシュボードのWordPress本体のアップデート注意喚起も無くす場合、プラグインはプラグインページで確認できますが、WordPressがアップデートされているかは分からなくなってしまいます。
定期的なアップデートは大切なので、誰しもが見れないようにするのではなく、ユーザー権限を変えて設定するなど管理ユーザーだけでも確認できるように設定する方が良いと思います。

管理画面のフッター変更

管理画面の一番下にWordPressへのリンクやバージョン情報が表示されていると思います。こちらも変更することが可能です。

// フッター左下のテキスト変更
function my_admin_footer_left () {
  echo '<a href="https://ja.wordpress.org/">wordpress.org へのリンク</a>';
}
add_filter('admin_footer_text', 'my_admin_footer_left');

// フッター右下のテキスト変更
function my_admin_footer_right () {
  echo 'wordpressのバージョンは最新です';
}
add_filter('update_footer', 'my_admin_footer_right', 11);

// フッターの上にテキストを追加
function my_admin_footer_above () {
    echo '<p style="margin: 10px 0; font-size: 16px;">追加のテキストも可能です。管理画面上に表示させておきたいテキストなどがあればこちらに記載しておきましょう。</p>';
}
add_filter('in_admin_footer', 'my_admin_footer_above');

上記のコードを記述した結果

また、出力内容を空欄にすればフッターには何も表示されません。

// フッター左下のテキスト変更
function my_admin_footer_left() {
  echo '';
}
add_filter('admin_footer_text', 'my_admin_footer_left');

// フッター右下のテキスト変更
function my_admin_footer_right() {
  echo '';
}
add_filter('update_footer', 'my_admin_footer_right', 11);

ウィジェットを追加して管理画面から共通パーツを編集

ウィジェットはサイトで共通して使用するパーツです。

特定のページへのリンクリストや、サイトのカテゴリー一覧などさまざまな箇所に同じように表示させたい場合に利用します。

ウィジェットはコーディングがわからない方でも編集することができます。表示を変更することが多いパーツやPHPファイルでの修正が難しい方がサイトを運用する場合など、ウィジェットにしておくと便利です。

投稿の種類を増やすカスタム投稿タイプ

投稿や固定ページなどWordPressにデフォルトで存在する投稿タイプとは別に、投稿の種類を増やすこともできます(カスタム投稿)。
雑記ブログは投稿で、作品紹介・商品紹介といったように投稿ジャンルがたくさんある場合には別の投稿タイプがあると記事の管理・整理がしやすいです。

投稿の入力項目を追加するカスタムフィールド

ブロックエディタでは色々なブロックやパターンなどを挿入してテキストを入力したり画像を設定したりすることができますが、あらかじめ入力する項目が決まっている、または入力内容を制限させたい場合などに便利なのがカスタムフィールドです。

記事に必要な内容を提示して入力漏れや間違いを少なくしたり、入力を楽に済ませることができます。

カテゴリー : WordPress

TOPへ