記事に長いURLがある場合の対処

自分の為の技術メモです・・・

WordPressを使ったブログで、記事に長いURLがあると、折り返されずに表示するので、スマートフォンなど横幅が狭い場合は、本分スペースからはみ出してしまうため、通常なら縦スクロールのみなのに横にスクロールもができるようになるため、扱いにくくなります。

その為の対処として、短縮URLにしたり、URLをリンクとして記載する方法もありますが、数が多いとそれも大変になるので、スタイルシートで調整しました。

スタイルシート (style.css)のbody要素に次のword-wrap:break-wordを追加します。

word-wrap:break-wordは、「単語の途中でも折り返す」という意味です。

URLは連続しているため１単語として扱われるため、折り返しがされないのを、単語の途中でも折り返すにすることで、URLがはみ出さないようにしています。

ただし、英語で記事を書いている場合は、単語の途中で折り返されて非常に読みづらくなるので、注意が必要です。