WordPressのタイトル内で改行したい場合の対応方法 ※ タグは動作しない

UZUREA編集部

公開:2024年4月30日（3か月前） / 更新:2024年5月22日

当記事の内容および記事中のリンクには、広告目的や当サイトが収益を得るためのものが含まれており、これらの収益によってuzurea.netは運営されています。

WordPressの記事や固定ページのタイトル欄でどうしても改行をしたいという場合の対応方法を記載しています。

なお、この記事で解説している内容はWordPressテーマのカスタマイズなどができる人向けの記事です。

記事の索引

1 WordPressの記事タイトル中で改行したいという要望に対応する処理
- 1.1 funcsions.phpに記述する内容
- 1.2 テーマファイルに記述する内容
2 まとめ

WordPressの記事タイトル中で改行したいという要望に対応する処理

以前は無理やり改行タグ などを入力する事で改行出来ない事もなかったのですが、現時点での最新WordPressバージョン（6.5.2から？）ではエスケープして文字列として が出力されるようになりました（※）。

※アップデート前に を入力している記事は改行できているのを観測しましたので、DBへの保存時に文字列をエスケープしてるのかな？細かいところはわかりませんが、詳しい方がいらしたらコメントなどでおおしえください。

と言う事で、いろいろ考えた結果、記事タイトル中に特定の文字が有る場合に、それを自動的に変換して出力するような処理が良いのかな、と。下記は記号『 | 』（バーティカルバー、パイプ）を入力した場合に、html に変換して出力するためのコードです。

funcsions.phpに記述する内容

まずは有効になっているテーマ内のfuncsions.phpに下記を追記します。

// 記事タイトルで改行したい方向けに｜ を改行に変換
//出力するときは custom_br_title(get_the_title()); などとする
function custom_br_title($title) {
	$title = str_replace('|', '<br>', $title); // 半角記号を<br>にする
	$title = str_replace('｜', '<br>', $title); //念のため全角も
	return $title;
}

テーマファイルに記述する内容

つづいて、上記の処理を適用したい箇所のテーマに

<?php echo custom_br_title(get_the_title()); ?>

などと記述すれば『記事タイトル前半 | 記事タイトル後半』のように入力した記事タイトルが、該当箇所では……

記事タイトル前半
記事タイトル後半

……のように出力されます。

また普通にget_the_title()とした箇所では、意図せず改行されたりしない上に、表示面でも『記事タイトル前半 | 記事タイトル後半』なら違和感がないのかな、と。

まとめ

内なるNoと言えるWebディレクターが「記事のタイトル中では改行を諦めてください」だとか、「その箇所で本当に改行必要でしょうか？」、「ユーザーの表示環境によって表示が異なるWebではレイアウトのための改行は極力……」などと囁きますが、こだわる人は何をどう伝えても理解や納得してくれない場合が多いですよね。

と言う事でちょっと手間ではありますが、そんな時の対応として自分用メモを兼ねて当記事を掲載しておきます。