WordPressテーマ「Cocoon」で、おすすめのスキンを10個ご紹介します。
スキンとは着せ替え機能のようなものです。簡単に見た目・デザインを変えられます。
でもスキンっていっぱいあって迷っちゃうんですよね。
10個それぞれの特徴も解説していくので、ぜひ参考にしてください。
YouTubeではもっと詳しく解説しています↓
スキンを選ぶポイント。
実は、スキンを選ぶポイントが2つあります。
記事一覧を、横長のデフォルト表示にするか、縦型カードにするか。
1つ目のポイントは、
記事一覧を横長のデフォルト表示にするか↓
それとも縦型カードにするか↓
です。
Cocoonは基本的に「Cocoon設定」→「インデックス」から、どちらか選べるようになってます↓（他にもあるんですが、大きく分けて2つ）
しかし、スキンによっては「スキン制御」といって、どちらか決まってしまっているものもあります↓
ご自身のブログをどっちのレイアウトにしたいか、で選ぶスキンも自ずと絞られてきます。
キーカラーを変えたときに、配色が変にならないか。
2つ目のポイントは、サイトのキーカラーを変えたときに配色が変にならないかどうか、です。
スキンは基本的に色もデザインされていてそのまま使えるんですけど、もし自分好みの色に変えたい場合に、キーカラーを変更すると見出しなどの配色が変になってしまうスキンもあります↓
「別に色を変えるつもりはない」「そのままの色でいい」という方は気にしなくて大丈夫です。
Cocoonでおすすめのスキン10選。
以上の2つのポイントを含めて、おすすめのスキンを10個ご紹介します。
Silk（シルク）
Silkは白ベースの、すっきりしていてキレイな見た目のスキンです。
ヘッダーも白なので、味気ない場合はCocoon設定の「ヘッダー」→「ヘッダー背景画像」から画像を設定すると、さらにきれいな見た目になります↓
記事一覧は縦型カードにもできます。
目次や見出しデザイン↓
キーカラーを変えても違和感がないので、好きな色に変えられます。
縦型カードにもできる、色も変えられる、万能で使いやすいテーマです。
イノセンス
イノセンスは「大人かわいい」をコンセプトにした、白系のスキンです。
これも、ヘッダー背景画像を設定してもいいでしょう。
背景は網目模様になっていて、これは変更できません。
また、記事一覧は縦型カード2列になっていて、スキン制御によりに変えられません。
目次や見出しのデザイン↓
キーカラーを変えると少し違和感があるので、変えるのはあまりおすすめしません。
COLORS
COLORSはイエロー、グリーン、ピンク、ブラック、ブルー、レッドと揃っていて、好きなものを選べます。
イエロー↓
記事一覧は縦型カードにもできます。
目次や見出しのデザイン↓
キーカラーを変えると、見出しの一部などに元の色が残り違和感があるので、色を変えるのはあまりおすすめしません。
みるらいと
みるらいとは、色味などがやわらかな印象のスキンです↓
ヘッダー背景画像を設定してもいいでしょう。
記事一覧は横長のデフォルト表示になっており、スキン制御により変えられません。
目次や見出しのデザイン↓
キーカラーを変更するとなんとなく違和感があるので、そのままの色で使うのをおすすめします。
grayish
grayish（グレイッシュ）はその名の通り、美しいグレーで統一されたスキンです。
一番の特徴は、画面いっぱいに広がる画像です。
これはCocoon設定の「ヘッダー」→「ヘッダー背景画像」から設定できます。
おしゃれで、ホームページにも使えるようなスキンですね。
記事一覧は縦型カード3列になっていて、スキン制御により変えられません。
また、トップページにはサイドバーはありません。記事ページにはあります。
目次や見出しのデザイン↓
キーカラーもスキン制御により変えられません。
メイド・イン・ヘブン
メイド・イン・ヘブンは他のスキンとはちょっと違っていて、作り込み機能が満載なスキンです。
このスキンにすると「外観」→「カスタマイズ」に「メイド・イン・ヘブン設定」が追加され、そこからいろいろカスタマイズできます。
メインビジュアルをスライダーにしたり、動画にもできる↓
見出しのデザインなども変えられる↓
記事一覧を縦型カードにもできます。
Season
Seasonは2色で季節を表現したスキンです。春夏秋冬あり、好きなものを選べます。
春↓
記事一覧は横長のデフォルト表示になっていて、スキン制御により変えられません。
目次や見出しのデザイン↓
キーカラーを変えると元の色とちぐはぐになるので、変更せずそのままの色を使うことをおすすめします。
手書きノート
手書きノートは5種類の色が用意されています。
背景はマス目になっていて、ノートに手書きしているようなデザイン。フォントもところどころ手書き風になっています。
グローバルナビにマウスを乗せると、蛍光ペンでアンダーラインを引いたようなアニメーションがでてきます。
記事一覧は縦型カードにもできます。
目次や見出しのデザイン↓
キーカラーを変えると、デザインが台無しになるのでおすすめはしません。
ミックス
ミックスはグリーン、レッド、ブルーがあります。
メインカラーとアクセントカラーがミックスしたデザインです。
ヘッダー背景画像を設定してもいい感じです。
記事一覧は縦型カードにもできます。
目次や見出しのデザイン↓
キーカラーを変えるとちょっとおかしくなるので、そのまま使うのをおすすめします。
スキンテンプレート
スキンテンプレートとは、スキンを自作するための「ひな形」のようなもので、必要最低限のスタイルのみ入った状態です。
これが何気におすすめで、自分好みにカスタマイズしやすいんです。特にCSSを書いてカスタマイズしたい人には向いています。
目次や見出しのデザインもリセットしやすい↓
記事一覧は縦型カードにもできます。
キーカラーを変えても違和感ありません。
ヘッダーロゴとヘッダー背景画像を設定して、キーカラーを変えるだけでもけっこういい感じになります↓
デフォルトで背景が薄いグレーなので、Cocoon設定の「全体」→「サイト背景色」から白にしてもいいと思います。
まとめ。
最後に表にしてまとめます。
| 縦型カード | キーカラー変更 | |
| SILK（シルク） | 〇 | 〇 |
| イノセンス | 〇（縦型カード2列のみ） | △ |
| COLORS | 〇 | △ |
| みるらいと | × | △ |
| grayish | 〇（縦型カード3列のみ） | × |
| メイド・イン・ヘブン | 〇 | 〇 |
| Season | × | △ |
| てがきノート | 〇 | △ |
| ミックス | 〇 | △ |
| スキンテンプレート | 〇 | 〇 |
いかがでしたでしょうか？
今回は、WordPressテーマ「Cocoon」でおすすめのスキンをご紹介しました。
他にも個性的なスキンがたくさんあるので、基本的には自分の好きなスキンを選べばいいと思います。
どれがいいか迷った際は、この記事を参考にしてみてください。
