Cocoon用のスキンを作りました。
Cocoonの汎用的なデザインや機能性をちゃんとベースに残しながら、このブログ「みるめも」のふわっとしたシンプルなテイストを足し合わせてみました。
落ち着いた雰囲気で文章を書いていきたい方にはきっと気に入っていただけるはず!
「全体的にかなりシンプル&配色のトーンも静かめ」なのでどんなジャンルでも使いやすいと思います。
デモサイトも用意しましたのでぜひご覧ください~
「みるらいと」デモサイト
ダウンロード
ダウンロードは のボタンからどうぞ。
親テーマ(子テーマでも可)のディレクトリにある「skins」フォルダに解凍した「mil-light」フォルダをアップロードするだけでCocoon設定から選択できるようになります。

親テーマのskinフォルダか子テーマのskinフォルダに入れたかによって、下にある「表示スキン」を適切に選択する必要があります。ご注意ください。
また、Cocoon本体にも同梱していただきましたので、わざわざこのページからダウンロードする必要はございません!
🎉作成したCocoon用スキン「みるらいと」をCocoonテーマ本体に同梱していただきました!
— みるみ - みるめも (@milmemo_net) August 13, 2020
今Cocoonをお使いの方もバージョンアップすれば設定画面から簡単にスキンを適用することができます。
ぜひ一度ご覧になってみてくださいね~! https://t.co/HEFofzILNv
普通にCocoonをインストールしたら選択できるようになってますよ。
追記 (2020/8/27) :スキンにはCocoon設定を制御することができる仕組みがあるのですが(option.csvというファイル)、それをご自身でカスタマイズした場合は子テーマのskinsフォルダに入れておかないとCocoonアップデートでカスタマイズが消滅するのでご注意ください。普段と同じです。
スキンを使ってくれている方からカスタマイズ相談を受けて気付いたので追記しました。
カラーバリエーションは1色のみです。
複数色展開も考えましたが、自分のセンスのなさを考慮すると他の色では同じ雰囲気を維持できないと思ったのでやめました…。笑
明らかなスタイル調整ミスなど不具合を見つけられた場合は、僕に直接連絡いただくかCocoonのフォーラムにお寄せいただく方が良いかもしれません。
作ってみて思ったこと
久しぶりにCocoonの設定を最初から最後まで全部確認して~~ってやってたので改めて機能の多さに驚きました。
しばらく見ない間に「昔苦労して自分で作った機能が今はもう標準で実装されてるん!?」とか発見もあって楽しかったです。笑

相変わらず本当にすごいテーマだ…。
CSSに手を加える箇所はかなり少なめにしたつもりですが、それでも1000行くらいにはなっちゃっているし(コード削減はほぼ意識していないせいもある)、多機能な分デザインの管理はやっぱり大変だろうなと思いました。
1人のユーザーからすると大部分が不要なCSSになってしまうわけで、汎用的なテーマを提供するのって本当にすごい労力の上に成り立っていることなんだよなぁ、と改めて感じたわけです。
でも「スキン」という仕組みでそれらをうまく隠蔽化して、ユーザーが手軽にデザインを着せ替えられる仕組みを導入しているCocoonは素敵ですよね!こんなテーマは他に見たことがない。
今回僕が作った「みるらいと」も、よろしければぜひお使いください!
この記事へのコメント
いつもお世話になってます。
アイキャッチがボヤいている状態を解除できないのですが、どのような設定をしたらよろしいでしょうか。
スキンを使っていただきありがとうございます…!
それはおそらくスキンによる問題ではないですね。
サイトのURLをご提示いただいたら解決案を示せるかもしれません。
https://yukinojyouhouhbako.com
こちらです。
この状態はCocoonの仕様です。インデックスカードのサムネイルは原寸画像ではなく320x180にリサイズされたものがWordPressに使われるようにバックで設定されています。
同様の問い合わせがフォーラムにも多数あったため、新しい機能が追加されています。下記を参考に作業すれば解決するはずです。
https://wp-cocoon.com/retina-thumbnail/
すみません、あと1つ聞きたいんですけど…。
なぜ僕のスキンを使っているわけではないのにこの記事へコメントされたんでしょうか?笑
ありがとうございます。
違うんですか!?すいません!
「あなたはこちらを使用中です」
のようなリンクをクリックするとこちらのサイトに繋がりました。
ので、こちらのものを使っていると思ってしまいました。
すいません。お手数おかけしました。