Cocoon

【超簡単】 WordPressテーマ:Cocoonに追加! 好みのスキンをダウンロードしてサイトの見た目や使い勝手をカスタマイズ変更してみよう!

今回は、WordPressテーマ: Cocoon(コクーン)に、
デザインパターン(=スキン、といいます)を追加実装して、お好きなデザインに変更してみたいと思います。

 

WordPressのスキンって何?
テーマとはどう違うの?

 

典拠: イエウール

スキンとは何か?という点ですが、

まず、サーバーが土地なら、
テーマというのは、ビルにするのか店舗にするのか、はてまた一般家屋にするのか、などの建物・家屋のスタイルの事でしたね!

今現在の、テーマ:Cocoonを導入しただけのデフォルトの状態では、
さすがテーマタイトルがCocoon(=繭の意味)というだけあって、
真っ白でとてもシンプルなデザインになっています。

 

しかしCocoonには、色んな種類のスキン(無料)が実装されているので、それらを利用して、使い勝手の良いもの、可愛いもの、などに、カスタマイズ変更する事ができます◎

典拠: Houston Chronicle

つまり、スキンというのは、色味や小見出しのデザインを変える事のできる、建物で言うなら「内装・塗装部分」の作業です。

 

え?これだけ?
自分の好きな画像は設定できないの?

 

典拠:Reddit

また、初心者の方で、
「WordPressのテーマを選ぶと、トップ画像とかはずっとそのままなのですか?」
「スキンはこれだけからしか選択肢が無いのですか?」
という疑問を持っている方が結構おられるのですが、大丈夫です◎

テーマやスキン、というのはあくまでもビルの外観であって、
ビルをどのように塗るのかは、管理者の自由です。

 

ですので、好きな画像をトップ部分に装備したり、
背景を可愛い模様にする事もできます◎

スキンをこれにしたら、隅から隅までその色とデザインに固定! という事では無いのです。
あくまでも外枠部分の枠組みが「スキン」というだけの話です。

 

この辺りは、実際に微調整を行ってゆく段階になったら、
「あ、こういうことか」と、謎が解ける事でしょう。

 

ま、そのような細かい微調整はおいおい行うとして、
とにもかくにも、まずはスキンを追加ダウンロードして、実装してみましょう!

 

一瞬で終わる!
Cocoonのスキン変更手順

 

まずは、WordPressの管理画面に入り、
左サイドバーから、Cocoon設定 > Cocoon設定 と進みます。

 

 

沢山のタブがあるかと思いますので、「スキン」というタブを選択!

 

 

こちらがスキン一覧になります。

左から、選択肢の〇・絵画みたいなアイコン・スキンタイトル・作者名、の順で並んでいますので、その「絵みたいなアイコン」に、上から順にカーソルを当ててみて下さい。

 

 

するとひとつひとつに、様々なデザインが表示されていくと思います。

クールでシンプルなものから、
可愛らしいデザインまで、様々ありますね!

 

 

これが良さそうだな、というのが決まったら、
1番左の選択肢の〇に、チェックを入れます。

勿論、あとで変更もできますので、深刻に悩まないでね◎

 

 

選択し終えたら、一番下の [変更をまとめて保存] を押すのを忘れずに!

 

スキン変更がうまくいったか、確認してみよう!

 

左上のサイト名にカーソルを当て、クリックします。

 

 

まず、元のサイトはこんな感じでした↓↓↓


 

私は、ピンクっぽいのを選びましたので、こんな風になりました!

無事変わりましたね!

お疲れさまです!

 

これからいくつか微調整が必要ですが、それはまた今度としましょう!

趣味ブログ・実益サイトが作れる無料の教科書

KIBAN バナー