Cocoonスキンを作成しました。

WordPressテーマを決める

Cocoonとは

CocoonはSimplicityの作者であるわいひらさんがSimplicityの後継テーマとして作成されてWordPress無料テーマで、「このクオリティが無料なら有料テーマ売れなくなる」という声が出るほど超高性能テーマです。

 

Cocoon公式サイト

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

 

Cocoonスキン機能

CocoonにはスキンというCocoonだけの機能が搭載されていて、スキンを選ぶだけでテーマを変えずにデザインをいつでも簡単に変更できる「着せ替え」機能です。

 

・スキン製作者としてCocoonの開発の一部を担うことができる

という魅力に惹かれてCocoonスキンを作成したところ、Cocoonに同梱してもらえました!

 

CocoonはSimplicity同様にカスタマイズしやすいシンプルなデザインがベースとなっています。ですから、そのまま使うとちょっと物足りないデザインになってしまいます。(まぁ標準でも十分といえば十分なんですが)

 

スキンを使用することでWordPress初心者でもCocoonをカスタマイズせずにデザインがワンクリックで変えられます。

 

がんちゃん作スキン「いつもの」

今回作ったスキンは1種類3色展開です。背景付きスキンを入れると全部で6色展開になります。

 

Cocoonスキン「いつもの」デモサイト

404 NOT FOUND | がんちゃんブログ

 

デモサイトのスキン切り替え

デモサイトをPCで見ると右側にスキン切り替えボタンがあります。好きなスキンを選んでもらうとそのスキンデザインのデモを見ることができます。

スキン切り替え

 

このスキンは背景画像を入れる前提で作っているのでぜひ背景を自分の好みで追加して使用してもらえるとうれしいです。

 

特にスマホで見ると、記事本文箇所はどんなWordPressテーマでもあまり見栄えが変わらないのでわざと余白を作って、パーツの合間には背景画像がちらっと出てくるようにしています。

読者の方がサイトを見てちょっと気持ちがほっこりしてもらえるといいなぁと思って作りました。

 

スマホで見た場合

 

背景画像の設定方法

404 NOT FOUND | がんちゃんブログ

 

がんちゃん作スキン「おでかけ」

第2作目Cocoonスキンは女性でも使いやすいファッション系デザイン「おでかけ」

cocoonスキン おでかけ

 

デモサイト

404 NOT FOUND | がんちゃんブログ

 

カラー展開はピンク・ブルー・レモンの3色。

 

今後のCocoonスキン作成

わいひらさんは、僕にとって憧れの人です。

ですからこうして少しだけでも携われたことがうれしくてたまりません。

 

まだまだ力不足で改善点がいっぱいありますのでスキン作りは、もっともっと行なっていく予定です。

 

みなさんからスキンのリクエストやご意見、改善点のご指摘もぜひいただけるとうれしいです。

 

コメント