WordPressテーマ「Simplicity」の後継となるテーマ「Cocoon」が公開されています。
色々進化しつつもSimplicityのシンプルさはしっかり引き継いでいるという印象です。ほんとすごい。
このブログも「Cocoon」利用中です！
私はワクワクする物に出会うとどこかカスタマイズして自分仕様にしたがるクセがあるのですが、この「Cocoon」もまさにそのワクワク状態です。
なので「Cocoon」のスキンも作ってみました！
個人的なワクワクポイントとしてファイル構成がSimplicityよりかなりすっきりしたこともあります。関数やテンプレートのカスタマイズもすごくやりやすい！
Cocoonスキン「モダンブラック」の特徴
いや、そもそも「Cocoon」というテーマ名が「繭のように白いシンプルなテーマ」がコンセプトなのに「黒」ってどうよ？と思いましたが、ブラック系が好きな人もいると思うので。シンプルだからこそカスタマイズのし甲斐があります。
このスキン「モダンブラック」とにかく色を使ってません。基本はブラック・グレー・ホワイトとなってます。
それでは細かく紹介していきます。
※Cocoonの設定はインストールしてすぐの基本デフォルトのままです。
ヘッダー部分
ヘッダーレイアウト「センターロゴ」
ヘッダーレイアウト「トップメニュー」
トップメニューにするだけだと左右に白い部分ができるので「ヘッダー全体背景色」と「グローバルナビ色」を同じ色に設定してください。
エントリーカード
カテゴリーの色を設定した場合はその色で表示します。未設定の場合はブラックになります。エントリーカードはマウスオーバーでうっすらシャドウが入ります。
見出し
目次
引用(Blockquote)
キャプションあり画像
拡張スタイル
デフォルトのカラーだとちょっと可愛すぎるので少し落ち着いた色にしてみました。
2019.6.3 スタイル対応できていなかった拡張スタイルを追加しました。
モバイルサイズだと少し違った表示になります。
SNSボタン
2019.6.3
SNSボタンのスタイルは削除しました。
標準の機能でカラー設定（モノクロ・ブランドカラー・白抜きブランドカラー）をお願いします。
本文下（関連記事の上）
本文の下で関連記事の上のフォローボタンなどのエリアはこのようになっています。
モバイルフッターバー
モバイルボタンレイアウトをスライドインボタンにしている場合、モバイルサイズでこのような表示になります。
デモサイト
他にも、「次のページ」リンクやフッターなど全体的に雰囲気を合わせています。
実際の表示イメージはデモサイトを見てもらった方が早いですね。
リンク デモサイト
※上記デモサイトはWPテーマCocoonのスキン表示テスト中です。
ダウンロード、アップデート情報
スキン「モダンブラック」はCocoon本体に同梱済みですのでダウンロードしなくても利用できますよ！
バージョン：1.2（2019.6.3）
1.2(2019.6.3)
・一部の拡張スタイルがスキンに合わせたスタイルになっていなかったのを修正しました。
・SNSボタンのスタイル削除しました。
1.1(2018.10.31)
目次のところとか分からないくらいの微妙な変更を加えています。
スキンの設定方法
ダウンロードしたファイルはフォルダごとCocoonテーマの「skins」フォルダにアップロードしてください。カスタマイズする場合は子テーマの「skins」フォルダにアップロードしてください。
そして、「Cocoon設定」の「スキン」タブを開いて「スキン一覧」から選択してください。
気軽に着せ替えできるテーマ「Cocoon」のスキン機能。「モダンブラック」も一度お試しくださいねー。
こちらも！
