WoedPress投稿の本文にのみリンク下線を表示させる方法

テーマによってはリンクの下線（アンダーライン）が表示されないデザインになっているものがある。リンクであることが分かりづらいため、あらためて表示させるコードを挿入する方法のメモです。

「追加CSSにコードを記入」する

記入する場所は「カスタマイズ＞追加CSS」。子テーマをいじるより手っ取り早く、子テーマが無い場合でも対応できる。

アンダーラインを表示させるごくシンプルなコードは下記のとおり。

a {
 text-decoration: underline;
}

ただしこのコードだと、ヘッダーやサイドバーなどすべての箇所でアンダーラインが表示されてしまう。

リンクだということがわかりやすいが、見た目がとても騒がしくなる。

追加CSSのコードをテーマに合わせて修正する

投稿の本文にのみアンダーラインを表示させるには、ソースを確認してCSSの適用範囲を絞ってやるとよい。

まず適当な投稿のページを右クリックして「ページのソースを表示」（ブラウザによる）。

投稿本文の最初の文字列をコピーして、Ctrl+Fでページ内検索。

この場合はdiv要素のentry-contentクラスで投稿本文が包まれているので、下記のようにCSSの適用範囲を狭める。

div.entry-content a {
 text-decoration: underline;
}

これでTAGSやサイドバーウィジェットには影響を与えず、投稿本文のみリンク下線を表示させることができた。