WordPressの投稿一覧でタイトルが縦書きになる原因と直し方｜幅を指定するCSSだけだと他の列が潰れる

2026年10月21日

WordPress

WordPressの管理画面で投稿一覧を開くと、タイトルが1文字ずつ縦に並んで読めなくなることがあります。原因は、一覧に並ぶ列が多すぎて、タイトルの列に幅が残らないことです。

直し方は3つあります。

一番簡単：表示オプションで、使わない列のチェックを外す（コードは要らない）
今だけ見たい：ブラウザの表示を縮小する（Macは「command」と「-」、Windowsは「Ctrl」と「-」）
列を減らしたくない：CSSでタイトル列に最低幅を付け、入りきらない分は一覧を横にスクロールさせる

よく紹介されている「タイトル列に幅を指定するCSS」は、タイトルは広がりますが、今度はほかの列が縦に潰れます。僕のサイトで実際に起きたので、測った数字と画面で説明します。確かめたのは2026年10月21日、WordPress 7.1.3です。

WordPressの投稿一覧でタイトルの列が細くなり、タイトルが1文字ずつ縦に並んでいる画面

これが直す前の僕の投稿一覧です。タイトルが縦に1文字ずつ並び、1件の行が画面の下まで伸びています。

目次 [ close ]

縦書きになる原因は、列が多すぎてタイトルの幅が残らないこと

タイトルの列は、ほかの列が幅を取ったあとの「残り」しかもらえません。WordPressの一覧の表は、投稿者・カテゴリー・タグ・日付などの列に先に幅を割り当て、タイトルには残った幅を使います。列が増えるほど、タイトルの幅が減っていきます。

列はWordPressの本体だけでなく、テーマやプラグインも足します。僕のサイトの一覧には、全部で17の列がありました（うちJetpackの3つは非表示）。

列	足しているもの
投稿者・カテゴリー・タグ・コメント・日付	WordPressの本体
表示数: 30日間・スキーマ・メタ情報・検索	Jetpack
計測	テーマのXWRITE（列の名前がxw_count_pv）
形式・題材・主題・時代	自分で作った分類（PublishPress Taxonomies）
ID・アイキャッチ画像	テーマやプラグイン

画面の幅が1100pxのとき、この状態ではタイトルの列の幅は0pxでした。タイトルが見えないか、1文字ずつ縦に並ぶのはこのためです。

テーマの違い（XWRITE・SWELL・Cocoonなど）は、管理画面の一覧の見た目には関係しません。一覧の表はWordPress本体の作りで表示されるので、どのテーマでも同じ直し方が効きます。違うのは、テーマやプラグインがいくつ列を足しているかだけです。

一番簡単なのは、表示オプションで使わない列を外すこと

コードを書かずに直すなら、表示オプションで列のチェックを外すのが一番早いです。設定はログインしている人ごとに残るので、一度外せば次からもそのままです。

WordPressの投稿一覧の表示オプションを開いた画面。カラムの欄に投稿者・カテゴリー・タグ・日付などのチェックが並んでいる

「表示オプション」のつまみ（投稿一覧の画面の右上、「ヘルプ」の左）を押して開く
「カラム」の欄で、普段見ない列のチェックを外す
外したらすぐ一覧に反映される（「適用」は件数を変えたときに押す）

外してよい列の目安は、一人で書いているなら「投稿者」、コメントを受け付けていないなら「コメント」です。アクセス数の列が2つ（Jetpackの表示数とテーマの計測など）あるなら、片方で足ります。

ただ、列が多いサイトでは、かなり外さないと読める幅になりません。僕のサイト（画面の幅1100px）で、列を1つずつ外して測った結果です。

外した列の数	タイトルの列の幅
0	0px
3（投稿者・コメント・表示数）	37px
6（＋ID・計測・タグ）	86px
9（＋カテゴリー・アイキャッチ・日付）	169px
10（＋形式）	212px（約14文字）

10の列を外して、やっと約14文字が1行に入りました。見たい列まで外すことになるなら、次のCSSで直すほうが向いています。

列を残したまま直すなら、CSSで最低幅と横スクロールを付ける

列を全部残したいなら、タイトルの列に最低幅を付け、入りきらない列は一覧の中だけ横にスクロールさせます。僕のサイトはこの形にしました。

CSSで直したあとの投稿一覧。タイトルが横書きで3行ほどに収まり、投稿者・カテゴリー・タグ・形式・題材の列もすべて読める

直したあとは、タイトルが約20文字の幅で横書きになり、ほかの列もすべて読めます。右にはみ出した列は、一覧を横にスクロールすると見られます。

入れるのは次のコードです。投稿一覧と固定ページの一覧（どちらも管理画面のedit.php）にだけ効き、サイトの表示には影響しません。コードの右上の「コピー」を押すと、そのまま写せます。

add_action( 'admin_head-edit.php', function () {
	echo '<style>
@media screen and (min-width: 783px) {
	#posts-filter { overflow-x: auto; clear: both; position: relative; }
	table.wp-list-table.fixed { table-layout: auto; }
	table.wp-list-table th.manage-column:not(.check-column) { min-width: 5em; }
	table.wp-list-table .column-title { min-width: 20em; }
	table.wp-list-table .column-date { min-width: 9em; }
}
</style>';
} );

コードの中身は5行です。

一覧のまわりを横にスクロールできるようにする
WordPressが表に付けている「幅を固定する組み方」をやめる
タイトル以外の列は、最低でも5文字分の幅を持つ
タイトルの列は、最低でも20文字分の幅を持つ
日付の列は、最低でも9文字分の幅を持つ

画面の幅が782px以下のときは何もしません。この幅では、WordPressが自動でタイトル中心の1列の表示に切り替えるからです。

functions.phpではなくWPCodeで入れると安全

コードは、テーマのfunctions.phpに直接書くより、WPCodeのようなプラグインで入れるのがおすすめです。テーマのfunctions.phpは、テーマを更新すると書いた分が消えます。書き間違えると管理画面に入れなくなることもあります。

WPCode（無料）での入れ方です。

管理画面の「コードスニペット」→「+ スニペットを追加」→「カスタムコード (新規スニペット) を追加」
コードタイプで「PHPスニペット」を選ぶ
上のコードを貼り、下の「挿入」で場所を「管理エリアのみ」にする
右上のスイッチを「有効」にして「スニペットを保存」

やめたくなったら、WPCodeのスニペットの一覧でスイッチを切るだけで元に戻ります。子テーマを使っているなら、子テーマのfunctions.phpに書いてもかまいません。

タイトルに幅を指定するだけのCSSは、ほかの列が潰れる

検索でよく出てくる「タイトルの列にwidthを指定する」CSSは、タイトルは広がりますが、そのぶんほかの列が縦に潰れます。表の幅は変わらないので、タイトルに渡した幅をほかの列から削るからです。

タイトルの列に400pxの幅を指定した投稿一覧。タイトルは横書きになったが、投稿者・カテゴリー・タグの列が重なり、日付が1文字ずつ縦に並んでいる

僕のサイト（画面の幅1100px）で、よく紹介されている3つの書き方を試した結果です。

タイトルに指定した幅	タイトル	投稿者	カテゴリー	日付
指定なし	0px	86px	120px	98px
200px	200px	45px	64px	52px
40ch	353px	14px	20px	16px
400px	400px	5px	7px	6px
この記事のCSS	280px	90px	90px	137px

列が少ないサイトなら、幅の指定だけでも足ります。列が多いサイトで、縦書きがタイトルからほかの列に移ったように見えたら、この記事のCSSに替えてみてください。

CSSが効かないときに確かめる3つ

CSSを入れても変わらないときは、たいてい「WordPressの指定のほうが強い」か「表の外側が邪魔をしている」かです。僕が直したときに、実際に3つ当たりました。

起きたこと	原因	直し方
書いたのに表が変わらない	WordPressの「table.fixed」の指定のほうが強く、自分のCSSが負けた	「table.wp-list-table.fixed」のように、同じかそれ以上に強く書く
一覧が右に寄って幅が半分になった	上の「すべて・公開済み・下書き」の行が左に浮いていて、その横に回り込んだ	一覧の外側に「clear: both」を付ける
ページ全体が横に伸びて、画面ごとスクロールする	読み上げ用の見えない文字が、スクロールの枠の外にはみ出していた	一覧の外側に「position: relative」を付ける

上のコードには、この3つの対策を最初から入れてあります。