WordPressで行間を調整してテキストをすっきり見せる方法

Word

文章をウェブ上で見やすくするためには、行間の調整が重要です。特にWordPressを使っている場合、テーマやエディターの設定だけでなく、CSSを用いることで標準よりも行間を縮めることが可能です。この記事では初心者でも簡単に実践できる方法を紹介します。

WordPressテーマで行間を調整する方法

多くのWordPressテーマでは、カスタマイザーやテーマオプションから行間を設定できます。例えば、”Typography”設定で”Line Height”の値を変更するだけで、全体の行間を調整可能です。

テーマによっては行間の単位がpxではなくemや%で設定されていることもあります。その場合、数値を少し小さくすることで文章が引き締まった印象になります。

投稿エディターでの個別行間調整

ブロックエディター(Gutenberg)では、特定の段落ブロックを選択し、右サイドバーの”高度な設定”でカスタムCSSクラスを追加できます。

例えば、以下のようにカスタムCSSを追加すると特定の段落だけ行間を縮められます。

.tight-line { line-height: 1.2; }

そして対象の段落にこのクラスを設定すれば、他の段落に影響を与えずに行間を調整できます。

CSSで全体の行間を変更する方法

サイト全体の行間を統一して調整したい場合は、外観→カスタマイズ→追加CSSに以下のように記述します。

p { line-height: 1.3; }

この数値を1.1~1.4の範囲で調整することで、読みやすさとデザインのバランスを保ちながら行間を縮められます。

注意点とベストプラクティス

行間を縮めすぎると文章が詰まって読みにくくなるので、1.2前後を目安に調整するのがおすすめです。また、モバイル表示でも読みやすいか確認することが重要です。

段落ごとに調整したい場合は、CSSクラスを活用すると効率的です。全体変更の場合はテーマの追加CSSを活用しましょう。

まとめ

WordPressで行間を標準より縮める方法は、テーマ設定、エディターでのカスタムCSS、追加CSSの3つの方法があります。適切に行間を調整することで文章の読みやすさが向上し、サイト全体のデザインもすっきり見せることが可能です。

コメント

タイトルとURLをコピーしました