四月くらいからWordPressテーマを「Cocoon」へ変更させていただいています。
かゆい所に手が届く・・・というよりかは
手がめっちゃいっぱい届き過ぎる！というくらい素敵なテーマです。
私が「Cocoon」を知ったのはテスト版でユーザー登録者のみ利用が可能な状態の時で、ほぼ毎日修正されており一般公開になるとどんだけ凄いことになるのかと今から楽しみなテーマでした。
公開後もさまざまな修正や追加があり、公式のフォーラムもCSS、JSに詳しい方がたくさんいらっしゃるようで覗くだけですごく勉強になります。
無料で使わせていただいている身。でもフォーラムの質問などに答えられるほどのスキルもない。何かちょっと私でもできることはないか・・・
まだまだ勉強中の身だけど、
スキン作成ならできる・・・かもしれない
ということで自分のページのスキン作成と同時に、
色違い2種類のスキンを自分用のスキンとは別で作成しました。
スキン名「ドット・ワインレッド」・「ドット・レイニーブルー」
赤を基調にした「ドット・ワインレッド」と
青を基調とした「ドット・レイニーブルー」です。
デモサイトはコチラ↓
こんな感じで背景用にドット柄を作りまして表示させています。
画像は2KB以内に抑えています。
スキンの使用により変わるところ
見出し
見出しはh5まで作成。シンプルにしています。
目次
枠だけですが変更しています。
引用文
引用部分も基本の色より少し薄い色に変更しています。
関連記事とコメント
左側に同色のアイコンを入れています。
ページネーション
「見出し」の次くらいにココを変更するとサイトのイメージが変わってくると思います。
サイドバーウィジェット
サイドバーはタイトル部分と人気記事のランキングの色を変えています。
パソコンやタブレットのフッター
フッターも同じ色の背景にし文字の色は白にしています。
ダウンロード
おまけ
背景用のイメージはいろいろあった方が楽しいかなと思いまして、
ドットの大きさ違いなどいろいろ作りました。思いついたらまた何個か追加します。
右クリック保存でご利用ください。
ドットの大きさ違い
ワインレッド
小さいの：
大きいの：
レイニーブルー
小さいの：
大きいの：
その他のデザイン
とりあえず現段階ではストライプのみ
ワインレッド
ストライプ01：
ストライプ02：
レイニーブルー
ストライプ01：
ストライプ02：
画像ファイルの変更方法
ワードプレスの「外観」→「カスタマイズ」→「背景画像」
もしくは直接、画像を「images」フォルダの中に入れて「style.css」のイメージ名を変える方法もあります。
色合いで「ワインレッド」「レイニーブルー」と分けていますが組み合わせは自由です。
使ってみるとそれはそれで良いカンジになるかもしれません。
商用利用もOK。編集もOKです。クレジット表記や許可も必要ありません。
もちろん、クレジット表記などhttps://woma2.com/を紹介してくださいましたらめっちゃ嬉しいです！！
背景を変えるだけでもページの雰囲気はまったく違ってきます。
いろいろ試してみて自分好みのページしていただければと思います！
おまけ・・・だったのですが、わいひらさんのサイトにてダウンロードもできることになりました。
Cocoon利用者さんのデザインに少しでも幅が広がれば！素敵やな！
まとめ
スキン作成はすごく楽しかったです。
ただ、作成していくうちに「もっとこうしたい、あーしたい」
といろいろ凝り性なところが出ちゃいますね・・・
「Cocoon」利用者さんもこれからドンドン増えて、
素敵なスキンもドンドン作られていくと思いますのでそれも楽しみです。
グリーン系も作りたい！背景も作りたい！
作りだしたらホント止まらんもんなぁ
コメント