Cocoonのスキン変更の手順、背景画像の変更

Cocoonのスキン変更の手順、背景画像の変更

今回は、大根畑の画像を使った「green-daikon」のスキンを作成

1. ぱくたそなどから背景画像をダウンロード
   大きさは、1920×1080pixが良いのでは
   今回は画像「green-daikon.jpg」を使いました。
   
2. スキンの名前のファイル作る（例：green-daikon）
   imageフォルダ中に画像を入れる
   style.cssは既成のファイルを外にコピーする
3. style.cssを変更する。赤字を変更します。
   
   /*
   Skin Name: green-daikon
   Description: takao がお届けする Cocoon のスキン green-daikon です。
   Skin URI:
   Author: takao
   Author URI:
   Screenshot URI:
   Version: 0.1.0
   Priority: 9930000000
   *//* Cocoon skin green-daikon */
   body {
   background:#fff url(“images/green-daikon.jpg”) no-repeat;
   background-size: cover;
   background-attachment: fixed;
   }
   body::before {
   content: “”;
   display: block;
   position: fixed;
   top: 0;
   left: 0;
   z-index: -1;
   width: 100%;
   height: 100vh;
   background: url(“images/green-daikon.jpg”) center no-repeat;
   background-size: auto;
   background-size: cover;
   }
4. デザインを変えたい場合
   既成ファイルtomatoのstyle.cssは455行ありますが、デザインを変えたい場合はこのCSSを変更します。
5. ワードプレスのフォルダーにFzでアップロードする
   Xserverに接続して以下のフォルダー中に入れる。
   ①sn.tas.red
   ②wp-contents
   ③themes
   ④cocoon-chiled-masters
   ⑤skins
   の中に作成したフォルダを入れる
6. Cocoon設定のスキンから選択する