WordPress

【WordPress】投稿のタイトルを改行する方法

2022年2月19日

※ 当サイトではアフィリエイト広告を利用しています

WordPressの投稿のタイトルって改行できない?

投稿のタイトルは1行のテキスト入力になっていて、通常は改行出来ません。

WordPress:投稿タイトル

WordPress:投稿タイトル

HTMLを知っている人であれば投稿時に<br>を書けば改行出来ます。

WordPress:投稿タイトル(<br>で改行)

WordPress:投稿タイトル(<br>で改行)

しかしWordPress案件の場合、投稿するのはクライアントなので『<br>と書けば改行できます』と言ってもピンと来ないと思います。

そこで今回は別の方法で改行するコードをご紹介していきます。

WordPressのオリジナルテーマ制作での作業を想定した内容です

じゅんぺいブログは、Web制作コーディングWordPress制作)の技術記事を中心に、約500記事公開しています。ぜひ他の記事も参考にしてみてください!
完全無料のプログラミングスクール『ZeroPlus Gate』
30日間でWeb制作を学べる無料のプログラミングスクールがこちら
いきなり数十万するプログラミングスクールは厳しい・・・という人のお試しに最適です。
現在は無料ですがいつ有料になるか分からないので、気になる方はお早めに👇
(有料になっていたらすいません🙇‍♂️)

\ 完全無料 /

ZeroPlus Gate公式サイト

毎日先着制!

WordPressで投稿のタイトルを改行する方法

まずは通常の投稿タイトルを読み込むコードは以下になります。

<h1>
  <?php the_title(); ?>
</h1>

そして改行させる方法は2つあります。

 

半角スペースで改行

まず1つはタイトルで『半角スペースを使う事で改行させる方法』です。

<h1>
  <?php
    $title = get_the_title($ID);
    $title = str_replace(" ", "<br>", $title);
    echo $title;
  ?>
</h1>

入力する時はこのようにします。

投稿タイトル:半角スペースで改行

投稿タイトル:半角スペースで改行

 

全角スペースで改行

もう一つはタイトルで『全角スペースを使う事で改行させる方法』です。

コードはこちらになります。

<h1>
  <?php
    $title = get_the_title($ID);
    $title = str_replace(" ", "<br>", $title);
    echo $title;
  ?>
</h1>

非常に似ていますが、" " の中身が半角スペースか全角スペースの違いになります。

ブログ上で見ると全角スペースの方が半角スペースのように見えますが、コピペすればOKです。

この場合はタイトルはこのように入力します。

投稿タイトル:全角スペースで改行

投稿タイトル:全角スペースで改行

まとめ

投稿のタイトルで改行というのはあまり見ないかも知れませんが、実務で1度使用したことがあったので今回ご紹介しました。

いざそういうデザインに出くわした時にこの記事を思い出してみて下さい。

以上になります。

この記事が役に立ったと思ったら、シェアボタンからX(旧Twitter)などにシェアすると、いいねされてフォロワーが増えたりすることがあるよ!

 

  • この記事を書いた人

じゅんぺい

37歳からWeb制作とブログ開始。Web制作歴5年目でコーディングとWordPressオリジナルテーマ制作が中心。これまで120件以上を納品。当ブログ月間最高15万PVで、370記事以上はWeb制作の技術記事。コンテンツ販売→累計売上1200万円&1500部超え。X(旧Twitter)フォロワー7200人以上。2024年3月からブログの経験を活かしてライターとしても活動を開始。

-WordPress