WordPressのテーマ「Cocoon」には、サイトのデザインを簡単に変更できる「スキン」という機能があります。
スキンを選ぶだけで、サイト全体の色合いや雰囲気を変えられるため、CSSなどの難しい設定をしなくてもデザインを整えられます。
この記事では、Cocoonを使い始めたばかりの初心者向けに、スキンの選び方と設定方法を紹介します。
Cocoonのスキンとは？
Cocoonのスキンとは、サイト全体のデザインをまとめて変更できる機能です。
スキンによって、色使いや見出し、背景などの見た目が変わります。
自分で細かくデザインを調整しなくても、好みのスキンを選ぶことでサイトの雰囲気を変えられます。
ブログの内容や自分の好みに合わせて選んでみましょう。
Cocoonのスキンを設定する方法
1．WordPressの管理画面を開く
まず、WordPressの管理画面にログインします。
左側のメニューから「Cocoon設定」を選びます。
2．「スキン」タブを開く
Cocoon設定の画面が開いたら、上部にある「スキン」タブをクリックします。
スキンの一覧が表示されます。
3．好きなスキンを選ぶ
一覧から、使ってみたいスキンを探します。
スキンによってデザインの雰囲気が異なるため、プレビュー画像などを参考にしながら選びましょう。
チェックを入れることで、使用するスキンを選択できます。
最初はひとつ選んで、実際のサイトで見た目を確認してみるのがおすすめです。
4．設定を保存する
スキンを選んだら、画面下部にある「変更をまとめて保存」をクリックします。
これでスキンの設定は完了です。
5．サイトを開いてデザインを確認する
設定を保存したら、実際のサイトを開いてデザインを確認します。
トップページだけでなく、記事ページも開いてみましょう。
見出しや背景、記事一覧などの見た目が変わっているか確認すると安心です。
スキンを選ぶときのポイント
スキンを選ぶときは、見た目だけでなく、サイトの内容や読みやすさも意識しましょう。
- 文字が読みやすいか
- サイトの内容に合った雰囲気か
- スマートフォンでも見やすいか
- 記事の写真やアイキャッチ画像と合っているか
スキンはあとから変更することもできます。いくつか試しながら、自分のサイトに合うものを探してみましょう。
スキンを変更しても反映されないとき
スキンを選んで保存したのに、サイトのデザインが変わらない場合があります。
そのようなときは、キャッシュが影響している可能性もあります。
以前、Cocoonのスキンが反映されなかったときの対処方法を別の記事にまとめています。
→ Cocoonのスキンを変更しても反映されない？LiteSpeed Cacheのキャッシュを削除したら解決した
まとめ
Cocoonのスキンは、設定画面から好みのデザインを選ぶだけで変更できます。
- Cocoon設定を開く
- スキンの一覧から好きなデザインを選ぶ
- 変更を保存する
- 実際のサイトで確認する
難しいコードを書く必要はないので、初めての方も気軽に試してみてください。
