【スキン制御とは】Cocoon スキン制御の説明と制御解除してみる

今日は、【Cocoon 設定】にある「スキン」タブの設定には「スキン制御」という内容があるをご存じでしょうか。

この内容は、スキン作成者が開発負担をできる限り軽減できるように実装した機能を示します。

なのでこの機能は、「スキン」を変えない限り基本的には使えないことになります。

では、この「スキン制御」を無理やり変更するとどうなるか試してみたいと思います。

動作スキン

まず、自身の使っているスキンを調べて編集する準備をしたいと思います。

Cocoonのスキンの中には、スキン制御が存在しないものもあります。その場合は、この作業は必要ありません。

例として、”スキンからオプション変更サンプル（CSV） [作者: わいひら]”でおこないたいと思います。

次に、実際にスキンが格納されている場所を確認したいと思います。

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

この中に、全てのスキン情報が格納されています。

編集方法

スキンフォルダを開くと、どのフォルダも大体以下のような構造になっています。

ここで、スキン制御の編集には主に3種類の方法があるので簡単にご紹介します。

• functions.php を編集する
• option.csv を編集する
• option.json を編集する

以上の3種類の方法の内、自分が使用しているスキンがどの方法で制御されているか確認すると、後の編集が楽かと思います。

functions.phpでのスキン制御

まず１つ目は、functions.php に設定を記述する方法です。

例えば、”スキンからオプション変更サンプル（PHP） [作者: わいひら]”では、functions.php にスキンを制御する記述があります。

このように記述されています。もし、functions.php で制御したい場合は

1. 既存のfunctions.php を編集する
2. フォルダ内に「functions.php」を作成して制御

以上のどちらかになるかと思います。

JSONファイルでスキン制御

次に、JSONファイルを使用する方法です。

例えば、スキンからオプション変更サンプル（JSON） [作者: わいひら]ではJSONファイルで制御されています。

このように記述されています。もし、JSONファイルで制御したい場合は

1. 既存のoption.json を編集する
2. フォルダ内に「option.json」を作成して制御

以上のどちらかになるかと思います。

CSVファイルでスキン制御

そして、CSVファイルで制御する方法です。

これが、最も簡単なやり方ということでおススメです。

このCSVファイルは、UTF-8で編集する必要があります。エクセルで編集せずメモ帳などのエディター等で編集してください。エクセルで編集すると、文字コードがシフトJISになってしまいます。

それでは、”スキンからオプション変更サンプル（CSV） [作者: わいひら]”を見てみたいと思います。

このようになっています。もし、CSVファイルで制御したい場合は

1. 既存のoption.csv を編集する
2. フォルダ内に「option.csv」を作成して制御

以上のどちらかになるかと思います。

編集してみる

それでは、実際に編集してみたいと思います。今回は「CSVファイル」でおこないます。

試しに編集する箇所は、以下の2箇所を変更してみます。

• サイトキーカラー：デフォルト値（#f09199）
• サイドバーの配置：デフォルト値（サイドバー右）

これらを変更してみます。

まずは、以下のフォルダにある「option.csv」ファイルを開きます。

/wp-content/themes/cocoon-master/skins/skin-demo-csv/option.csv

次に、その中にあるスキン制御項目から以下を項目を編集します。

• site_key_color,#f09199：サイトキーカラー
• sidebar_position,sidebar_right：サイドバーの配置

では、これらを以下のように適当に編集してみます。

• site_key_color,#FF822E
• sidebar_position,sidebar_left

これが編集後のプレビューになります。

これで問題なければ「option.csv」編集作業は以上です。

子テーマにスキンをアップロード

そして最後に、子テーマにskinデータをコピー（アップロード）します。

これは、親テーマだとを更新した時などに上書きされてしまうため子テーマにskinデータをコピー（アップロード）しておきます。

アップロード先は以下になります。

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

以上で作業は完了になります。

補足

スキン制御を3種類の内どの順番で読み込まれるのかというと以下のようになるようです。

1. functions.php
2. option.csv
3. option.json

ただし、同じ設定を記述した場合は、後から読み込まれるファイル優先されるようです。

例えば、「option.csv」に設定を記述した場合、優先順位は以下のように変化します。

1. option.csv
2. functions.php
3. option.json

以上となるため、スキン制御の設定を記述するときは１つのファイルに決めて設定するとわかりやすい記述ができると思います。

まとめ

いかがだったでしょうか。

CSVファイル やfunctions.php 設定することで「スキン制御」の設定はおこなえることがわかりました。

もともとスキン制御している機能を無理に変更すると、テーマに影響がでる可能性があるのでやめたほうがよさそうです。

ここまでお読みいただき、ありがとうございました。