ブログの見た目をブログテーマに合った見た目にしたい!
![ちーちゃん](https://whitebear-pola.net/wp-content/uploads/2021/12/ちー.png)
ちーちゃん
うーん。
![ぽーちゃん](https://whitebear-pola.net/wp-content/uploads/2021/12/ぽー-1.png)
ぽーちゃん
またお悩みのようね。ちーちゃん。
![ちーちゃん](https://whitebear-pola.net/wp-content/uploads/2021/12/ちー.png)
ちーちゃん
ブログの見た目をかわいくしたいなあ。
![ぽーちゃん](https://whitebear-pola.net/wp-content/uploads/2021/12/ぽー-1.png)
ぽーちゃん
そうね。せっかくマスコットキャラの私たちがいるんだしね。
cocoonにはデフォルトで使い易くいいかんじのスキンが多数用意されています。
またまた詳しくはcocoon作者のわいひらさんの紹介サイトで。
![ぽーちゃん](https://whitebear-pola.net/wp-content/uploads/2021/12/ぽー-1.png)
ぽーちゃん
わいひらさんのサイトでは実際に右カラムからcocoonのスキンを変更して見た目を変えることができるから参考にしてみてね。
今回気になったスキンはみるみさん作成の「みるらいと」
![](/wp-content/uploads/2021/12/スクショへんしう2-1024x614.png)
![ちーちゃん](https://whitebear-pola.net/wp-content/uploads/2021/12/ちー.png)
ちーちゃん
シンプルだけどとってもかわいいスキンだね!!かわいいくまにまみれたこのブログにはぴったり!!
![ぽーちゃん](https://whitebear-pola.net/wp-content/uploads/2021/12/ぽー-1.png)
ぽーちゃん
自分でかわいいって言っちゃったわね…
という訳で下記の記事をみながらスキンをお着換えしてみます。
![](https://whitebear-pola.net/wp-content/uploads/cocoon-resources/blog-card-cache/da4b56a6d88e5b6f61f6810930c5350f.jpg)
Cocoonスキンの機能の仕様
Cocoonのスキン機能に関する詳細な仕様書です。スキン機能を利用すれば、洋服を着替える感覚でサイトデザインを変更することが可能です。
![](/wp-content/uploads/2021/12/スクショへんしう1-1024x614.png)
![ちーちゃん](https://whitebear-pola.net/wp-content/uploads/2021/12/ちー.png)
ちーちゃん
あれれ。スキンを設定したのに反映されないね…
![ぽーちゃん](https://whitebear-pola.net/wp-content/uploads/2021/12/ぽー-1.png)
ぽーちゃん
あらま。ちょっとあちこち触ってみましょうか。
スキンを設定したら、ついでに右カラムをカスタマイズしよう
![ぽーちゃん](https://whitebear-pola.net/wp-content/uploads/2021/12/ぽー-1.png)
ぽーちゃん
ちょっと戸惑ってしまったけど解決したので以下でその手順を解説するわね。今回は少し画像が多くなってしまったので、重い場合は気長に読んで欲しいわ。ごめんなさいね。
ダッシュボードから「外観」→「カスタマイズ」を選択。
![カスタマイズ画面のスクリーンショット](/wp-content/uploads/2021/12/スクショへんしう3-1024x530.png)
「ウィジット」を選択。
![](/wp-content/uploads/2021/12/スクショへんしう5-1024x516.png)
「サイドバー」を選択。
![](/wp-content/uploads/2021/12/スクショへんしう6-1024x516.png)
「ウィジェットを追加」ボタンで追加。もしくは削除(次項に説明画像)
![](/wp-content/uploads/2021/12/スクショへんしう7-1024x516.png)
ブロックの横の「▼(プルダウンボタン)」を押して「削除」で不要なウィジットは削除することができるので、表示したいウィジットは表示し、表示させたくないウィジットは削除します。
![](/wp-content/uploads/2021/12/スクショへんしう8-1024x516.png)
スキンの見た目を反映する為には表示させたいウィジットも一度削除し、再度追加するして公開ボタンを押す必要がある様です。
![](/wp-content/uploads/2021/12/スクショへんしう9-1024x671.png)
![ぽーちゃん](https://whitebear-pola.net/wp-content/uploads/2021/12/ぽー-1.png)
ぽーちゃん
というわけで出来たわね。
![ちーちゃん](https://whitebear-pola.net/wp-content/uploads/2021/12/ちー.png)
ちーちゃん
まだコンテンツが少ないのでちょっとあっさりな感じだね。
![ぽーちゃん](https://whitebear-pola.net/wp-content/uploads/2021/12/ぽー-1.png)
ぽーちゃん
そうね。今後はもう少しいろいろと充実させていきたいわね。
wordpressテーマ「cocoon」で右カラムにスキンが反映されない時にすることまとめ
- ダッシュボードから「外観」→「カスタマイズ」を選択。
- 「ウィジット」を選択。
- 「サイドバー」を選択。
- 「ウィジェットを追加」ボタンで追加。もしくは削除
![ぽーちゃん](https://whitebear-pola.net/wp-content/uploads/2021/12/ぽー-1.png)
ぽーちゃん
今回の記事は普通にウィジットを追加したい時にも参考になると思うので、良かったら参考にしてね。