【Cocoon】ブログデザインの柱となる和風スキン9種類

Cocoonカスタマイズ和風スキン
この記事は約4分で読めます。

ブログを運営していく上で、デザインは大きな役割を担っています。

もちろん記事の内容ありきですが、デザインもブログを支える立派な柱といえます。

ということで今回は、和の色を使ったグラデーションがおしゃれな、ブログデザインの柱となってくれそうなスキンを9種類作ってみました。

実は私、公式に同梱済のCocoonスキンを作った、ちょっとすごい人なんですよ。

9種類のデザイン一覧

和風スキン「雅」

可愛さと大人っぽさを兼揃えた和風スキン。

いつもにこやかに、読み手の心に刺さるような記事が書けそうです。

和風スキン「桜」

天真爛漫、春らしさ満開の和風スキン。

思わずキュンとしてしまうかわいらしさを目指しました。

和風スキン「朧」

霞がかった月夜をイメージした和風スキン。

記事ネタも無限に広がりそうです。

お気に入りのスキンなら、毎日更新も忘れないかも?!

和風スキン「疾」

竹林を駆け抜ける風をイメージした和風スキン。

キリッと締める色・優しい色を両方使って、見る場所によってギャップのあるデザインにしました。

グリーン系は人気でわりと多いですが、この配色はなかなか稀ではないでしょうか。

和風スキン「慈」

自然をイメージした和風スキン。渋さがイイ感じです。

その佇まいは、9つのデザインの中でも最強と言えるでしょう。

優しく落ち着いた気持ちで記事を書けそうです。

和風スキン「粋」

日本伝統の色を使った、粋な色合いの和風スキン。

これだけ唯一、ナビバーにもグラデーションを使っています。

一見、派手派手に見えますが、色の系統を揃えているのですっきりまとまっています。

和風スキン「漆」

漆黒カラーの和風スキン。

色合いがとてもシンプルなので、飽きずに粘り強く記事を書けそうです。

個人的には1番上手くできたと思っているお気に入り。

余談ですが漆黒(しっこく)の読み方、「しつこく」だと思っていました😅

和風スキン「灼」

燃える炎をイメージした和風スキン!フッター付近では赫くグラデーションになっているぞ!

ブログ記事は日々の更新の積み重ねが大事!

大変な時でも背中を押してくれそうです!

心を燃やせ!

和風スキン「凪」

静かな水面をイメージした和風スキン。

タブの切り替えでは、紫と緑が半々になるというこだわりよう。

記事を書くときは、言葉足らずにならないことだけ気をつけて!

各スキンの使い方

サーバーにアップロード、またはコピペして使います。

サーバーにアップロードする方法

まずはサーバーにアップロードする方法を説明します。

zipファイルをダウンロード後、FTPソフトを使ってサーバーにアップロードします。

アップロード先は

/wp-content/themes/cocoon-child-master/skins

です。

アップロードが完了すると「Cocoon設定」のスキン選択画面に、先ほどアップしたスキンが表示されているはずです。

あとはデフォルトのスキンと同様、クリックして選択し、使うことができます。

「FTPソフトって何?」という方は、FTPソフトのインストールや導入の仕方を以下の記事にまとめていますのでお読みください。

コピペする方法

続いてコピペで行う方法を解説していきます。FTPソフトを使ったことがない方はこちらの方が簡単です。

まずは、使いたいスキンのzipファイルをダウンロードして解凍します。

フォルダ内のCSSファイル

フォルダ内のCSSファイル(全スキン共「style.css」という名前になっています)を開き、中のコードを全て「カスタマイズ」→「追加CSS」にコピペします。

追加CSS

このとき、「Cocoon設定」でスキンは「なし」を選択してください。

そうしないと他のスキンのデザインも反映されてしまいます。

Cocoon設定

コピペしたら「公開」を押して、カスタマイズ内容が反映されていれば成功です!

まとめ:9種類のスキン作成、とっても楽しかったです

はい、とっても楽しかったです。

こういうテーマでスキンを作ってみるのも良いかな!

あとは楽しく記事を書きましょう!

おまけ:よもやよもや

鬼滅の刃を、好奇心から英語で読んでみました。

英語で読むと愛着が湧いてさらにこの漫画が好きになったので、よかったらみなさんも読んでみてくださいね!

コメント

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