WordPressでカスタムフィールドの値入力欄で改行入力した際、単純に表示させるだけでは改行は反映されずに表示されます。それをしっかり改行も反映させて表示させたり、改行された各行を任意のタグで括ってから表示させたりする方法です。
※紹介している内容は下の入力イメージのように入力欄がテキストエリアの場合で説明しています。
※ここではいずれもget_post_meta($post_id, $key, $single);を利用する形で紹介します。
また、エスケープしたり値有無のチェックを行うなどの記述は省いているので、もしこの内容を使用する場合は必要に応じて追記してください。
単純に表示する
例としてキーが「foo」だった場合、表示する方法としてよく見るひとつが以下のような記述になります。
<?php echo get_post_meta($post->ID , 'foo', true); ?>この方法で表示しようとした場合、例えば上に合った入力イメージのようにカスタムフィールド入力欄で「あいうえお（改行）かきくけこ（改行）さしすせそ」という感じで改行をエンターで行って入力しても表示は改行されておらず、むしろ無駄なスペースが入ってるような状態で「あいうえお かきくけこ さしすせそ」と表示がされてしまいます。
なので、もしこの方法で改行もちゃんと反映させたいという時は、入力する際に「あいうえお<br>かきくけこ<br>さしすせそ」という形でbr（改行タグ）を記述する必要があります。
改行も反映させて表示する
先ほど紹介した方法の場合、普段からWeb制作に携わっているとか多少HTML書けるといったような人であればbrを記述するぐらいそこまで手間ではないかもしれませんが、そうでない人やとにかく手間を省きたいという時は、やはりいちいち改行タグを書かなくても入力欄内でエンターを使って改行するだけで表示もちゃんと改行されているようにしたいこともあります。
その場合は表示させたい部分へ以下のようにnl2brを用いる形で記述すればわざわざ改行タグを書かなくても自動で改行タグが挿入され、自分が入力した内容の見栄えをそのまま表示してくれます。
以下は先ほどと同様、例としてキーが「foo」だった場合の記述です。
<?php echo nl2br(get_post_meta($post->ID, 'foo', true)); ?>各行を任意のタグで括って表示する
上で紹介した方法はいずれも入力した内容をただ表示させるだけでしたが、こちらは少し違ったタイプのもので、入力欄で改行付きで記述した場合にその各行を任意のタグで括って表示をさせる方法になります。
同じく例としてキーが「foo」だった場合、表示させたい箇所に以下のように記述します。
<?php
$values = explode("\n" , get_post_meta($post->ID, 'foo', true));
foreach( $values as $value ) {
echo "<div>" .$value. "</div>\n";
}
?>カスタムフィールド入力欄で冒頭にあった入力イメージのように記述していた場合、上記を記述して表示を確認すると以下のようにそれぞれdivで括られた状態で表示されるのを確認できます。
今回はサンプルとしてdivを使用していますが、他のタグにしたいとか何かクラスをつけたいなどは赤文字部分を変更してください。
<div>あいうえお</div>
<div>かきくけこ</div>
<div>さしすせそ</div>正直この方法は実際の案件とかで使ったことがあるわけでもなく今後も使うかどうか微妙ですが、こういうのもできるということで教えてもらったので備忘録兼ねて紹介しました。