WordPressの記事タイトルを改行したい人へ解説!HTMLタグbrを使う

※記事内にプロモーションが含まれています。

悩める人
悩める人

ワードプレスの記事ページのタイトルを改行したいです。

きつねコード
きつねコード

wordpressで記事タイトルを改行する方法についてご紹介します。めっちゃ簡単です!

この記事でわかること

  • wordpressの記事タイトルでの改行方法
  • 改行するときの注意点

あなたのサイトをプロ仕様に!

本気でやるためのWordPressテーマをチェック

※PV・売上アップを狙うなら

WordPressの記事タイトルに改行を入れる方法・HTMLタグbrを使う

簡単ですので、初心者でもすぐに可能です。

やり方は

<br>タグを挿入する

だけです。

<br>タグとは、改行を意味する基本的なHTMLタグです。使えるシーンも多いので、覚えておくと良いでしょう。
(ちなみに、"break"の略。)

こんな感じで記事ページのタイトルに入れてみます↓

wordpressの記事ページタイトルにbrタグを入れて改行する

HTMLタグを入れる時は必ず「半角」を使うのがお作法です。かっこが外れたり、不必要なスペースを入れたり、全角を使ったりしないように注意しましょう。

ページタイトルを確認してみると、きちんと改行されていますね↓

wordpressの記事ページタイトルにbrタグを入れて改行された状態

ちなみに、タイトルに改行を入れると、下の画像の通りトップページでも同じように改行されますので、その辺りは認識しておきましょう。

wordpressトップページでも、タイトルが改行されている

<br>タグは、htmlが正常に機能する場所であればワードプレス内の他の場所でも使うことは可能です。

どこでも使えるわけではありませんが、もし「改行したい!」というシチュエーションがあり、テキストを編集できるのであれば<br>タグを試してみる価値はあります。覚えておくとよいでしょう。

WordPressの記事ページ見出しを改行するのにbrタグは使えますか

記事ページの「見出し」でもbrタグで改行することはできるのでしょうか?

結論から言うと、見出しではbrは使えません。
(wordpressテーマにもよるかもしれませんが、多分無理)

wordpress記事編集ページの見出しにbrタグを入れてみる

確認してみると、<br>がそのままテキストとして表示されているだけですね↓

wordpress記事ページの見出しにbrタグを入れても改行されない

もし見出しで改行したい人は、(望みは薄いけど)「HTMLタグで編集」を選んでから、もう一度<br>タグを入れてみてください。それで保存して上手くいかなければ、諦める方が良いかなと私は思います(笑)。

wordpressに搭載されている自動整形機能で、<br>タグが"不要なタグ"とみなされて勝手に消されていることが原因かと思います。手段がないこともないですが、影響範囲を考えるとあまりいじりたくはない設定かなと思うので私ならやらないです。


ちなみに余談ですが、私が利用しているAffinger6テーマでは、

affinger6で見出しを改行する

このように改行したい場所で、Shift + Enter をクリックすると見出しにおいても段落内改行が効きます。

ページを確認してみても、普通に改行が効いています。

affinger6で見出しの改行

そのため、使っているwordpressテーマによっても挙動は異なるということですね。

ご自身のテーマでも、一応確認してみるとよいかもしれません。

brタグで改行する時の注意点

記事タイトルや見出しで改行するときに気をつけておきたいことがあります。

<br>タグを覚えると便利なのでつい多用したくなりますが、

あなたが見ている画面と、ユーザーが見ている画面の、画面幅は異なるということを忘れずに認識しておきましょう!

つまり、「良きところで改行を入れた」と思っていても、実は異なる画面幅で見てみると余計におかしくなっていることも多々あります。(特にスマホとかね。)

そのため、改行を入れる際にはパソコンのブラウザの画面幅を伸び縮みさせながらチェックしてみるのが良いです。

そもそも改行なしの方が最適という可能性もあるので、十分気をつけてくださいね。

  • この記事を書いた人

きつねコード

webディレクター/プログラマー。 web系の経験が10年以上あり、webサービスの立ち上げやメディア運営などをやっていました。若い時に起業していた時期もあるので、守備範囲は結構広めです。パソコンが苦手な人からの質問も受けるので、参考になればとの想いで当ブログを始めました。

人気記事

wordpressのおすすめテーマはこれ 1

この記事を書いているきつねコードは、10年以上wordpressに触れており、自身でもブログを運営しています。 当記事で紹介する以外にも、多くのwordpres ...

おすすめのASP 2

登録必須のおすすめASP(ブログ初心者〜上級者) ブログやサイトを作成したら、まずASPヘの登録は行いましょう。 結論を言うと、初心者でも上級者でも下記の王道5 ...

ラッコキーワードの使い方を徹底解説! 3

この記事でわかること ラッコキーワードを使うと何ができるのか? 他のツールと比べたときのラッコの優位性 ラッコキーワードの超具体的な使い方 (初心者向け)SEO ...

cocoonからaffinger6への移行手順 4

cocoon以外のテーマからaffinger6へ移行する場合もチェック項目は大体同じですので、参考にしてみてください。 結論:cocoonとAffinger6ど ...

cocoonからswellに移行する全手順 5

cocoon以外のテーマからswellへ移行する場合でも、確認することとしては大体同じ手順となります。ご参考にしてみてください。 結論:cocoonとswell ...

AFFINGERタグ管理マネージャーとPVモニター 6

この記事でわかること 初心者に、「タグ管理マネージャー&PVモニター」が良い理由 Affinger6の専用プラグイン「タグ管理マネージャー」の使い方 Affin ...

-ブログ・wordpress運営, 使い方・初期設定
-, ,