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

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

悩める人
悩める人

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

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

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

この記事でわかること

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

ちなみに蛇足ながら、、、きつねコードも普段の作業に使っていますが、モニターを買って2画面でPC作業するようになると格段に効率が上がります

モバイルモニターだと持ち運びもできてどこでも使える&すっごい軽くて便利です。ケーブルも一式付属してるのでwindowsでもmacでもいけます。

2画面、作業するテンションも上がりますよ笑😆


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>タグを覚えると便利なのでつい多用したくなりますが、

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

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

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

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

おすすめテーマランキング[PR]

【第1位】AFFINGER6 ¥14,800円

affinger6バナー

「稼げるサイトを作りたい人」におすすめ。収益化をサポートするための仕掛けが本当に良く出来ているので、使いこなせれば成果アップにつながる。カスタマイズ自由度も高いので個性も出せる。当サイトで利用中。もちろんSEOにも強い。

【第2位】swell ¥17,600円

こちらは万人向け。いま一番売れてる有料テーマ。多機能ながらも直感的な操作ができるので、「とにかく使いやすい」。初心者〜上級者にも愛用され、導入してすぐオシャレなサイトになる。SEOにも強くバランスが良いと言える。

【第3位】Cocoon ¥0円

cocoonバナー

一言で言えば「コスパ最強」。なんでこれが無料?必要十分な機能で、シンプルなので初心者にもgood。費用をかけずとりあえずサイトを始めたい人に最適。ゼロからサイトを作る人は、レンタルサーバーの「Xサーバー」で、wordpressクイックスタート機能というのを使うのがおすすめ。即cocoonサイトができる。2個目のブログにも。

  • この記事を書いた人

きつねコード

webディレクター&プログラマー。子育て真っ最中の2児のパパ。 10年以上Web系の経験を積み、サービス立ち上げやメディア運営など、幅広いジャンルに携わってきました。若い頃に起業した経験もあるので、少し守備範囲は広めかもしれません。パソコンが苦手な方からも質問をいただくことが多く、「少しでも役に立てれば」との思いでこのブログを始めました。

人気記事

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

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

おすすめのASP 2

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

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

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

cocoonからaffinger6への移行手順 4

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

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

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

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

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

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