![](https://starting-marketing.com/wp-content/uploads/2021/12/tianyi-ma-WiONHd_zYI4-unsplash.jpg)
この記事ではCocoon設定の【スキン】のタブについて解説していきます。
このスキンという項目ではデザインテンプレートの変更ができる設定になっていて、サイト全体のデザインを変えることができる項目になります。
![](https://starting-marketing.com/wp-content/uploads/2021/12/image-1.jpg)
スキン設定
プレビュー
![](https://starting-marketing.com/wp-content/uploads/2021/12/6893e31e0942184c5491b76a08296403.jpg)
まずすぐ下に【プレビュー】の画面があり、今現在のデザインが表示されています。
スキン一覧
![](https://starting-marketing.com/wp-content/uploads/2021/12/f0bd4d42767ee0df84ffa6b2ec41c20a.jpg)
さらにその下に【スキン一覧】というものがあり、ここから選択するだけで簡単に外観を変更することができます。
デフォルトでは「なし」にチェックが入っています。
画像マークにカーソルを合わせるとデザインのイメージを確認することができ、名前をクリックするとサンプルサイトを見ることもできます。
![](https://starting-marketing.com/wp-content/uploads/2021/12/b2b5f59bb668a70080eeb57f1ab0e46f.gif)
ここで、お好きなデザインのテンプレートにチェックを入れると変更することができます。
テンプレートを決めたら、ページの最上部か、もしく最下部に「変更をまとめて保存」というボタンがありますのでクリックします。
![](https://starting-marketing.com/wp-content/uploads/2021/12/e8874c3f34b04212c90d2eef9e22fa6d.jpg)
すると、プレビュー画面に選択したテンプレートに変更されたページが表示され、サイトのデザインが変更されます。
表示スキン
![](https://starting-marketing.com/wp-content/uploads/2021/12/fd5103035b109bd59cd9b7474565912b.jpg)
【表示スキン】では、親テーマのスキンだけを表示したり、逆に子テーマのスキンのみを表示させるなど分けて表示させることができます。