WordPressの編集画面のカスタマイズ【Comfortable Admin Page】

ブロックエディターはWordPressの標準エディタです。

バージョンが上がるたびにチューニングし続けられており、初期のころに比べればかなり使い勝手がよくなってきました。

それでも、細かい部分に使いにくさが残っているので、Comfortable Admin Pageでは少しでも使い勝手を向上させるカスタマイズ機能を盛り込みました。

非表示にする埋め込みブロック

非表示にする埋め込みブロック

ブロックエディタには「埋め込み」というブロックがあり、X(Twitter)やYouTubeなどを埋め込むためのブロックがブロックの選択モードに出てきます。

埋め込みのブロックは非常に数が多いにもかかわらず、個々にオンオフを切り替えることができません。

そこで、自分が使う可能性のあるものだけに絞って残りを非表示にする機能を用意しました。

  1. <編集画面>タブをクリックします。
  2. 非表示にする埋め込みブロック欄で、不要な埋め込みブロックにチェックを入れます。
  3. <変更を保存>ボタンを押すと、編集画面の埋め込み欄から不要なものが削除されます。

チェックを外して保存すれば元に戻せます。

ショートコードの追加

ショートコードの追加

日付に関するショートコードを4つ追加しています。

概要詳細ショートコード
今日の年今日の年の数字を返す[today_year]
今日の月今日の月の数字を返す[today_month]
今日の日今日の日の数字を返す[today_day]
経過年数指定した日付から今日までの年数を返す[ago from="2010-01-01]
  • XXX歴〇年
  • 今年で〇歳
  • 〇年〇月更新

のような経過年数や最新情報を謳う表現をする際に自動で数字部分が計算されると修正する必要がなくなります。

  1. <編集画面>タブをクリックします。
  2. ショートコードの追加欄で、使いたいショートコードにチェックを入れます
  3. <変更を保存>ボタンを押すと、ショートコードを使えるようになります。

チェックを外して保存すればショートコードで入力していた箇所はテキストの状態で表示されます。

タイトルタグでショートコードを使えるようにする

タイトルタグに【2025年10月最新】のように最新であることを示したい記事などは、毎月日付だけ更新しなくてはいけなくなります。

運用負荷が高くなると大変ですので自動で更新されるようにしたくなるはず。しかし、デフォルトではタイトルタグではショートコードが実行できず、WordPressテーマもしくはSEOプラグインにそういった機能がないと、タイトルタグの日付を自動で更新してくれません。

そこで、今日の日付から月数・年数を自動取得するショートコードを実行できる機能を追加しました。この機能を使えばタイトルタグにショートコードを書いておけば自動的に日付が更新されます。

  1. <編集画面>タブをクリックします。
  2. ショートコードの有効化欄で、お使いのSEOプラグインにチェックを入れます
  3. <変更を保存>ボタンを押すと、ショートコードを使えるようになります。

チェックを外して保存すればショートコードは実行されなくなります。

ほとんどのWordPressテーマでは、h1はWordPressの標準タイトルを使用しています。

タグの選択方法

WordPressの投稿画面でカテゴリーの入力はチェックボックス方式ですが、タグについては入力欄で自由入力する形になっています。

これを、カテゴリーと同じくチェックボックスで選択する方式に変更するオプションを追加しています。

  1. <編集画面>タブをクリックします。
  2. タグの選択方法欄で、「タグの選択をチェックボックス形式に変更する」にチェックを入れます。
  3. <変更を保存>ボタンを押すと、編集画面でカテゴリーと同じチェックボックス方式でタグを選択することができるようになります。

チェックを外して保存すれば元に戻せます。

カテゴリー・タグ選択欄を広げる

カテゴリーとタグの選択欄は標準では高さが250px前後となっており、1度に表示できる選択肢が6個前後となっています。

カテゴリー数が少ないブログでは問題ありませんが、カテゴリーが多めのブログではスクロールが発生し、かなり選択しづらくなってしまいます。

そこで、カテゴリーやタグの選択欄の高さを拡張し、選択しやすい状態にします。

  1. <編集画面>タブをクリックします。
  2. カテゴリー・タグ選択欄を広げる欄で、「カテゴリー・タグ選択欄のスクロールをなくし、項目数に応じて高さを自動調整する」にチェックを入れます。
  3. <変更を保存>ボタンを押すと、カテゴリー欄が拡張され、スクロールがなくなります。

チェックを外して保存すれば元に戻せます。

極端にカテゴリー数が多いと、スクロールが残った方が良い場合もありますのでその場合はオフにしておきましょう。

編集画面でカテゴリーやタグが追加されるのを防ぐ

WordPressのブロックエディターでは、カテゴリーやタグをその場で追加することができます。

しかし、行き当たりばったりにカテゴリーやタグを追加していくと、無限に増えまくるようになり、場合によっては1つのタグやカテゴリーに1記事しかない、といったことにもつながりかねません。

サイトの設計をしっかり行っているのであれば、他のユーザーに勝手に追加されては迷惑に感じる場合もあるでしょう。

そこで、カテゴリーリストやタグリストの中から勝手にカテゴリーやタグが追加できないように非表示にしてしまう機能を用意しています。

  1. <編集画面>タブをクリックします。
  2. 新規追加UIの非表示欄で、「カテゴリーおよびタグの「新規追加」リンクとフォームを非表示にする」にチェックを入れます。
  3. <変更を保存>ボタンを押すと、カテゴリーの追加のリンクが非表示になります。

チェックを外して保存すれば元に戻せます。

リビジョン設定

リビジョン設定

WordPressにはリビジョンという機能があり、保存するごとに「世代」が出来上がります。

元の状態に戻したいときはリビジョンを戻せば一発で戻すことができます。

非常に便利な機能ですが、標準ではリビジョン数に上限が設けられておらず、無尽蔵にリビジョンが増えていき、データベースが肥大化することでの速度が低下してしまいます。

そこで保存できるリビジョン(世代)に上限を設定し、リビジョンが増えすぎないようにするオプションを追加しました。

  1. <編集画面>タブをクリックします。
  2. リビジョン設定欄で、希望する管理方法にチェックを入れます。リビジョン機能を一切使わない場合は無効にすればデータは保存されません。リビジョン件数を指定すれば指定回数分のみ保存されるようになります。
  3. <変更を保存>ボタンを押すと、リビジョンの保存回数が変更されます。

初期状態で選択されている「WordPress のデフォルト設定に従う」を選択しなおせば元に戻すことができます。

運用中のブログでリビジョンの上限を設定すると、それ最新から指定件数以前のリビジョンは削除されるのでご注意ください。

ブロックの追加マークを大きくする

ブロックエディターでは、ブロックの境界には青い+マーク、一番下のブロックでは黒い+マークが表示されます。

サイズが控えめなため、マウスでつかみにくい(クリックしにくい)ため、サイズを大きくするカスタマイズ機能です。

  1. <編集画面>タブをクリックします。
  2. ブロックの追加マーク欄の「ブロックの追加マーク(黒いプラスマーク)のサイズを大きくする」にチェックを入れます。
  3. <変更を保存>ボタンを押すと、+マークが大きく表示されるようになります。

チェックを外して<変更を保存>すれば元に戻ります。

高度な設定を常に開く

ブロックエディターでブロックを選択した際に、一番下に「高度な設定」があります。

CSSのIDやクラスを割り当てることができるのですが、ブロックを切り替えるたびに閉じられてしまい、都度開きなおさなければなりません。

特にコンテナ系のブロックを使用する際はクラス名・ID名を多く付与することが多いため、毎回閉じられてしまうとやや不便です。

ブロック選択時に「高度な設定」が必ず開いた状態にするカスタマイズです。

  1. <編集画面>タブをクリックします。
  2. 高度な設定欄の「高度な設定パネルを初期状態で開く」にチェックを入れます。
  3. <変更を保存>ボタンを押すと、+マークが大きく表示されるようになります。

チェックを外して<変更を保存>すれば元に戻ります。

パーマリンクの入力欄を広げる

リンクを設定する際に、リンク先を記述しますが、外部リンクなどでURLを記入するにはやや狭くなっています(デフォルトでは350px)。

見通しが悪くなってしまうので、幅を広げて入力内容を見えやすくします。

  1. <編集画面>タブをクリックします。
  2. パーマリンク入力欄の幅欄の「パーマリンクの入力欄を広げる」にチェックを入れます。
  3. <変更を保存>ボタンを押すと、+マークが大きく表示されるようになります。

チェックを外して<変更を保存>すれば元に戻ります。

外部サイトへのリンク削除

ブロックエディターのサイドパネル内は様々な設定を行うことができますが、いくつかのパネルには外部へのリンクが設定されています。

ついうっかりそれらをクリックしてしまい、編集画面から離れてしまうことが多いため、非表示に切り替えてしまうカスタマイズです。

  • 代替テキストの下にある説明文
  • 高度な設定のHTMLアンカー下にある説明文
  • 高度な設定のタイトル属性下にある説明文

をそれぞれ非表示にできます。

  1. <編集画面>タブをクリックします。
  2. 外部サイトへのリンク削除欄の設定したいものにチェックを入れます。
  3. <変更を保存>ボタンを押すと、外部リンクを含む説明テキストが表示されなくなります。

チェックを外して<変更を保存>すれば元に戻ります。

投稿情報パネルの消せない項目の非表示

投稿情報のパネルは記事のステータスを編集したりするパネルですが、項目数が非常に増えてきました。

標準のブロックエディタの設定画面で消せるのは、アイキャッチ・抜粋・ディスカッションなどですが、消すことができない項目についても必要なければ非表示にできるようにしました。

削除可能な項目
  • タイトル
  • 投稿者
  • リビジョン
  • 単語数・読了時間
  • 最終編集日
  • 「ゴミ箱へ移動」ボタン
  1. <編集画面>タブをクリックします。
  2. 投稿情報の非表示欄の設定したいものにチェックを入れます。
  3. <変更を保存>ボタンを押すと、外部リンクを含む説明テキストが表示されなくなります。

チェックを外して<変更を保存>すれば元に戻ります。

自動保存の間隔

WordPressには編集中の内容を自動で保存する機能があります。

急にブラウザが落ちた場合や、うっかり戻るボタンで編集画面を離れても編集中の状態に戻すことができるため、非常に便利な機能です。

しかし、問題は自動保存される間隔で、デフォルトでは60秒に設定されています。自動保存が実行されるたびにリビジョンが更新されていくため、リビジョン(データベース)の肥大化を招きます。

そこで、自動保存が実行される間隔を分数で指定できるようにしています。

  1. <編集画面>タブをクリックします。
  2. 自動保存の間隔欄で、保存する間隔を決めます。
  3. <変更を保存>ボタンを押すと、指定した分数おきに保存されるようになります。

入力した値を削除すると、デフォルトの1分間に戻ります。

おすすめ設定

よほど不安定な環境でない限り、10~15分程度の間隔にすることをお勧めします。

日本語URLになるのを防ぐ

ブロックエディタでは、パーマリンクは自分で半角英数字に変えないと、日本語のURLになってしまいます。

日本語のURLが必ずしも悪というわけではありませんが、うっかり変更し忘れていた場合であっても日本語URLになってしまうのは避けたいところ。

そこで、保存時にスラッグに日本語が含まれる場合は強制的に英数字になる機能を用意しました。

投稿タイプ-IDの書式で保存されます
  • 投稿 → post-123
  • 固定ページ → page-123
  • メディア → attachment-123
  • カスタム投稿 → カスタム投稿のスラッグ-123

※123はIDの数字です。

  1. <編集画面>タブをクリックします。
  2. 日本語スラッグの禁止欄で、「スラッグが日本語になるのを防ぐ」にチェックを入れます
  3. <変更を保存>ボタンを押すと、日本語で保存されそうになると投稿タイプのスラッグ-IDの形式でスラッグが書き換わります。

チェックを外すと変換は行われなくなります。

既存記事を編集する際にも適用されるので、現在日本語のスラッグで運用しているページがある場合は設定しないようにしてください。URLが変更になるとSEO評価がリセットされる可能性があります。

編集画面用CSS

編集画面用CSS

管理画面内だけ適用されるCSSを設定する機能です。

主に、ブロックエディタの見た目をサイトの表示と合致させる利用を想定しています。

WordPressの現在のデフォルトエディタであるブロックエディタはサイトの表示を再現しており、見たままに近い形で入力することができます。

しかし、表示幅が微妙に違っていたり、リンクカラーが違っていたり段落の幅に微妙な差があることが少なくありません。

CSSの知識があれば、編集画面用CSSで微調整を行うことで見た目を完全に一致させることができます。

  1. <編集画面>タブをクリックします。
  2. 編集画面用CSS欄のテキストエリアにCSSを入力します。
  3. 適用する投稿タイプにチェックを入れます
  4. <変更を保存>ボタンを押すと、指定した投稿タイプのブロックエディタの編集画面でCSSが読み込まれます。

適用する投稿タイプのチェックボックスをすべてオフにするか、入力したCSSを削除すると元に戻ります。

<style>タグは入力不要です。コメントを書くことは可能です。CSSを書ける人向けの設定になっています。

おすすめ設定:サイト画面と改行位置(画面幅)を合わせる

使用しているテーマによって指定方法は異なるかもしれませんが、大半のテーマでは下記の設定でエディタの幅を変更することができます。

.wp-block {
  max-width: 840px !important;
}