WordPressテーマCocoonのデザインスキン「Fuwari和色」を作りました

Cocoonのデザインスキン「Fuwari和色」

WordPressテーマCocoonのスキン「Fuwari和色」を作りました。

以前に作成した「モダンブラック」もわりと評判いいようで、使ってくださってる皆さんありがとうございます!

WordPressテーマCocoonの黒系スキン「モダンブラック」を作りました
気軽にブログの着せ替えができるCocoonのスキン機能。シンプルなデザインを活かしつつ落ち着いた感じのスキンを作ってみました。
スポンサーリンク

WordPressテーマ「Cocoon」とは?

Cocoonを初めて使う方に少し説明を。

WordPress無料テーマで人気の「Simplicity」。その後継となるテーマが「Cocoon」です。(※完全な互換ではない)

CocoonはSimplicityのコンセプトである「シンプル」「SEO対策」「カスタマイズしやすい」を引き継ぎつつも機能をさらにアップさせた最強テーマです。無料なのが信じられないくらい…。

デザインはシンプルですがそれを活かした機能として、デザインを着せ替えできる「スキン」があるのもCocoonの特徴のひとつです。

Cocoon
SEO・高速化・モバイルファースト最適化済みのシンプルな無料Wordpressテーマ。100%GPLテーマです。

Cocoonスキン「Fuwari和色」について

今回公開する「Fuwari和色」は試作版をデモサイトで設定して放置していたところ「公開しないんですか?」というお問い合わせを何件がいただいたので、それじゃあと公開することにしました。

「Fuwari和色」は和色をベースにふわりと色が付いたスキンとなっています。色の候補が20色くらいあったのですがその中でいい感じ(適当!)の色を選んで4色に絞り込みました。

和色

ひとつの和色をベースに明度を変えてスキンのカラーとして使用しています。色だけ見るとすごく地味な感じですが、主張しすぎないシンプルなスキンとなっています。

日本の伝統色 和色大辞典 - Traditional Colors of Japan
日本の伝統色の名前とカラーコードが一目でわかるWEB色見本

見出し

見出し

拡張スタイル ボックス

全色共通です。

拡張スタイル:ボックス

拡張スタイル:ボックス

SNSシェアボタン

SNSシェアボタンの設定で「モノクロ」を選択するとスキンカラーで表示します。

Fuwari -御召茶(おめしちゃ)-の場合

SNSボタン

ページ送りナビ

Fuwari -御召茶(おめしちゃ)-の場合

ページ送りナビ

モバイル(スライドインボタン)

Fuwari -御召茶(おめしちゃ)-の場合

モバイル

デモサイト

Cocoonスキンの表示を実際に確認したい方はデモサイトを用意していますのでご覧ください。

「モダンブラック」「Fuwari和色(4色)」を切り替えて確認することができます。

DEMO SITE | Cocoonスキン表示デモサイト

Fuwari和色スキンダウンロード

アオイ
アオイ

スキン「Fuwari和色」はCocoon本体に同梱されていますよー!
よろしく!

バージョン:1.1(2019.6.3) ※大きな変更はありません。軽微な修正のみ。

Download スキン Fuwari -海老茶(えびちゃ)- (6 KB)

Download スキン Fuwari -海松茶(みるちゃ)- (6 KB)

Download スキン Fuwari -御召茶(おめしちゃ)- (6 KB)

Download スキン Fuwari -褐色(かちいろ)- (6 KB)

Cocoonスキンについては公式ページでご確認ください。

Cocoonスキンの機能の仕様
Cocoonのスキン機能に関する詳細な仕様書です。スキン機能を利用すれば、洋服を着替える感覚でサイトデザインを変更することが可能です。

さいごに

スキンを使いたいとお問い合わせくださった皆さんありがとうございました。お待たせしましたがようやく公開することができました。

別のスキンをリクエストくださった方もいるので現在制作中です。気長にお待ちください!

WordPressテーマCocoonの黒系スキン「モダンブラック」を作りました
気軽にブログの着せ替えができるCocoonのスキン機能。シンプルなデザインを活かしつつ落ち着いた感じのスキンを作ってみました。
WordPress
PROFILE
アオイ

スマホもタブレットもAndroid派。新しいWEBサービスやツール、ガジェットはすぐ試したいタイプ。ネコとミズタマが好き。何かをカスタマイズしがち。

アオイをフォローする
スポンサーリンク
スポンサーリンク
ミズタマブログ
タイトルとURLをコピーしました