Personal WP Customization Notes (PWCN)

WordPressの管理画面で列を増やしていくと、下図赤枠のような形で欄外に表示されてしまうことがあります。

これ、以下の方法で結構簡単に解消できるので、メモとして公開しておきます。

管理画面の列があふれるのを防ぐ方法

列があふれてしまう原因

管理画面の列があふれてしまうのは、あふれてしまう列のスタイル設定（スタイルコード）が欠落していることが大きな原因で、スタイルが欠落している列の右（後）に表示される列がない場合にのみ発生します。

従って、ある時から突然そうなってしまうという印象を受けるかも知れません。

あふれてしまう列にスタイルを与えて解消

まずは、あふれてしまった列が表示されている状態で、コンソール（デベロッパーツール　－「F12」で開ける）その列のCSSクラスを調べます。

上記画像の例では、こんな風になっています。

この列のスタイルコードはこのようになっています。

.widefat tfoot tr td, .widefat tfoot tr th, .widefat thead tr td, .widefat thead tr th {
    color: #2c3338;
}

特別この列に対するスタイルは指定されていません（これがあふれる原因です）。

解消するために、以下のスタイルを追加します。

.column-imsanity {
    width: 10%;
}

ただ、管理画面側にスタイルを適用させる必要があり、テーマの追加CSSなどにコードを追加しても反映されません。それ用のスタイルシートがテーマに備わっていればそこへ追加し、そうでない場合は以下のコードを有効化しているテーマのfunctions.phpへ追加します。

function pwcn_admin_column_style_init(){
?>
<style>
.column-imsanity {
    width: 10%;
}
</style>
<?php
}
add_action('admin_footer','pwcn_admin_column_style_init');

今回の例では「Imsanity」というプラグインが出力する列がたまたまあふれたのに対処したのですが、特定の列に対するCSSクラスは、都度デベロッパーツールで調べるようにしてください。

.column-カラムの名前