ワードプレスに慣れていない方は、テンプレートを直接使ったり、誤ってテーマのHTMLソースを編集してしまう人も。その結果サイト全体の構成が崩れることもあります。WordPressには簡単にCSSをカスタマイズできる場所があるんですよ。
サイト全体のデザインを変える方法
先ずはWordPress全体のCSSを変更する方法から紹介します。この部分にCSSの記述を加えれば、全てのページに反映させることができますよ。
外観からカスタマイズを選択する
WordPressへログインしたら、左サイドメニューにある「外観」続けて「カスタマイズ」の順にクリックをして下さい。画面が切り替わり、全体のレイアウトや情報の編集メニューが現れれば次へ進みます。
追加CSS(カスタムCSS)を選択する
左サイドバーのメニューより、最下部へスクロールすると、追加CSS(またはカスタムCSS)と記されたボタンがあるので、クリックして下さい。すると、メニューの部分だけが切り替わり、何も記入されていない真っ白な記入欄が出てきます。
空欄部分にCSSのを追加する
表示された真っ白な記入欄にCSSを追加していきましょう。記入方法に決まりはありません。
注意していただきたいのは、ここに記述したCSSは、サイト全体に優先して当ります。そのため、記述する際は、全体を意識するようにしましょう。
また1記事のみに反映させたい場合は次の方法があります。
1つの記事だけデザインを変える方法
サイト全体にではなく、特定ページのCSSだけ変更したい場合は、投稿ページ下部にある追加ヘッダー(またはカスタムCSS)の枠からもCSSを指定することができます。この枠へCSSを入力するときは、CSSの上下を<style>で囲う必要があります。
もし「あれ?CSSが効いてないな」と思ったときは<style>の入力漏れが無いかチェックしましょう。
まとめ
WordPressでは基本的なCSSやjavascriptの設定が自由にできるようになっています。色やデザインを変えることで、見やすいレイアウトを作りましょう。