スポンサーリンク

WordPressテーマ「Cocoon」のオリジナルスキン紹介

Customize

WordPressとcssの理解を深めたい目的で、Cocoonのオリジナルスキンを制作しました。

CSSを勉強し始めて1週間で作成したスキンですが、もし、使ってくださる方がおりましたらダウンロードしてご利用ください。

また、色合いなどについては時々改良していくかもしれませんので、更新した場合は本ページ(ファイル更新日を修正します)にてお知らせします。

スポンサーリンク

桃一色(サンプルページとサンプル画像)

すべてが桃色で統一されたデザインのスキンです。見やすさを考慮した結果一部は紫色っぽくなっています。

サンプルページは下のリンクからご確認ください。

桃一色のサンプル画像

スポンサーリンク

緑一色(サンプルページとサンプル画像)

すべてが緑色で統一されたデザインのスキンです。サンプルページは下のリンクからご確認ください。

緑一色のサンプル画像

スポンサーリンク

青一色(サンプルページとサンプル画像)

すべてが青色で統一されたデザインのスキンです。サンプルページは下のリンクからご確認ください。

青一色のサンプル画像

スポンサーリンク

赤一色(サンプルページとサンプル画像)

すべてが赤色で統一されたデザインのスキンです。サンプルページは下のリンクからご確認ください。

赤一色のサンプル画像

スポンサーリンク

灰一色(サンプルページとサンプル画像)

すべてが灰色で統一されたデザインのスキンです。サンプルページは下のリンクからご確認ください。

灰一色のサンプル画像

ダウンロード

ダウンロードはこちらからお願いします。(zipファイルとなっていますので、解凍してご利用ください)

テーマ名称 ダウンロードファイル 更新日
桃一色 skin-como-pink R3.11.10
緑一色 skin-como-green R3.11.10
青一色 skin-como-blue R3.11.10
赤一色 skin-como-red R3.11.11
灰一色 skin-como-gray R3.11.11

もし、不具合や改良のアドバイス等がございましたら「お問い合わせページ」からコメントいただけると助かります。

使用方法

ZIPファイルをダウンロードした後、解答してできたフォルダを、FTPクライアントアプリなどを利用して「cocoon-child-master」の直下にある「skins」フォルダに入れてください。

cocoonでの操作

「cocoon設定」の「スキン」のタグに移動して、下の画像のように「子テーマのスキンのみ表示」を選択するか「全てのスキンを表示」を選択すると「〇一色」が出てきますので、選択すると反映されます。

cocoonの設定

さいごに

現在のところ「一色」シリーズは5色作りました。今後はもう少しCSSについての知識を高めて、もう少し複雑なスキンも作ってみたいと考えております。

また、本スキンについて動作確認はしておりますが、私が使っていない設定や機能をお使いの場合は、デザインが崩れる可能性がありますので、留意のうえご使用ください。

コメント

タイトルとURLをコピーしました