Release 2017.11.20

(日本語) WordPress備忘録 メインタイトルの改行

Sorry, this entry is only available in Japanese. For the sake of viewer convenience, the content is shown below in the alternative language. You may click the link to switch the active language.

Sorry, this entry is only available in Japanese. For the sake of viewer convenience, the content is shown below in the alternative language. You may click the link to switch the active language.

主に自分のためのWordpressカスタマイズ情報。

記事のタイトルにサブタイトルつけて改行したい場合、<br/>で分けてしまうと芳しくない。サーチエンジンや、タイトルが参照された時などに、意図しないレイアウトで表示されてしまう。

そこで、タグ指定でsub-title扱いにし、CSSで改行させるようにする。

メインタイトルにタグを仕込む

サブタイトルにしたい部分をタグで囲む。

CSSでの改行指定

改行を指定するには下記の書き方。

SYNCER – CSSで改行をする

ただし、使用しているテーマ「Twenteen-fifteen」では、記事中、アーカイブ・一覧、で記事タイトルの「ヘッドライン」位置づけが違う。

アーカイブ、ホームなどの一覧 h2
単独記事内 h1

よって、それぞれに対応したCSSを書く必要がある。

カテゴリによって書き分ける

メインタイトルのタグ分けは、

entry-title

となっているため、これをh1、h2で機能するよう、それぞれで改行を設定。ついでにspanでも装飾を指定する。

参考リンク

Leave a Reply

This site uses Akismet to reduce spam. Learn how your comment data is processed.