テーマをカスタマイズしてしまう前に子テーマを準備しよう
2016/04/08
WordPressのカスタマイズをするためには、テーマのテンプレートファイルに書いてあるhtmlコードを触る必要があるとわかった、たのちん管理人なむ。
早速カスタマイズしてみよう！と思ったのですが、どうやらその前に「子テーマ」というものを準備する必要があるようです。
子テーマは、どうやって準備したらいいのでしょう？
スポンサーリンク
Contents
カスタマイズは元々のルール（コード）を少し書き換えて行う
WordPressテーマでは、どんなパソコンやスマホ、OSやブラウザでも、そのテーマ通りの画面を表示するためのルール（コード）が決められています。
その決められたルール（コード）によって、そのテーマごとのデザインや機能が付加されています。
このルール（コード）をイチから自分で全部作るのはプロでないと難しいので、わたしたちのようなシロウトは既存のテーマをお借りすることで、自分のWordPressのブログにデザインや機能を実装することができます。
テーマはそのままでも充分機能的に作られています。
カスタマイズしなくても使えるものが多いです。
むしろシロウトが下手に手を加えるとロクなことにならないかもしれません。
が、しかし。
自分のブログとして愛着をもって育てていこうと思うと、ほんのちょっぴりカスタマイズしたくなってしまうのが人情というものです( *´艸｀)笑
例えば、たのちんが使わせていただいているWordPressテーマ「STINGER5」には、初期設定ではサイドバーにプロフィール欄はありません。
「STINGER5」のサイドバーは、RSSバー→検索ボックス→NEW POSTという並び順で表示するルールになっています。
でもなむは、「サイドバーの一番上に広告枠」と「検索ボックスとNEW POST（新しく書いた記事）の間にプロフィール欄」を挿入したかった。
たのちんに今ついているみたいなプロフィール欄を作ろうと思ったら、「STINGER5のサイドバーのテンプレートファイルに記述されているコードを少し変更する必要がある」ということになります。
＊参考：【カスタマイズ】自己紹介をするためのプロフィール欄を作ってみる
カスタマイズをするときは子テーマにした方がいい
ここからはちょっとややこしいです…。
ややこしいというか難解です。わたしは未だにキチンと理解できていません（またかｗ）。
ものすごく単純に書きます。
- テーマのインストールは済みました
- ちょこっとテーマカスタマイズしたいです
- テーマのテンプレートファイルにあるコードを書き換えます
手順はこれでOKです。
OKなのですが、これだとひとつ大きな問題があるみたいなんです。
それは、テーマのバージョンアップが行われた際に発生します。
WordPressのテーマはよく使われている人気のあるものであればあるほど、頻繁に機能追加や不具合の修正などのバージョンアップが行われます。
できるだけ快適に使える最新バージョンに更新（アップデート）していきたいですよね。しかし、アップデートをすると、テーマは丸ごとそっくり最新バージョンに書き換えられてしまうんです。
苦労して施したカスタマイズの上に上書きされてしまうということになります。
一生懸命試行錯誤した、あの血と涙と汗の結晶はどこに…水泡と帰す…（完）
たぶん、3日くらいヤル気なくなると思います。
そうならないための秘策が「子テーマ」です。
テーマカスタマイズは基本的に「子テーマ」に施すことがルールです。
子テーマと親テーマ
なむも、テーマに直接カスタマイズを加えてはいけないことはなんとなくわかりました。
そこで、「子テーマ」の出番です。
「子テーマ」が作られる元々のテーマのことは「親テーマ」と呼びます。
たのちんの場合、「親テーマ」は「STINGER5」です。
「STINGER5」のデザインや機能がベースになっています。
そこに少しカスタマイズをしたいのですが、親テーマである「STINGER5」を直接修正してしまうと、アップデートを行った時にそれまでのカスタマイズが消えてなくなってしまいます。
そこで、「STINGER5」に直接修正を加えることなくカスタマイズを反映させる、「子テーマ」というものを使うことにします。
子テーマは、親テーマに付属するカスタマイズ専用のテーマ。ということになります。
カスタマイズは子テーマに施してあるので、親テーマのバージョンが変わってもカスタマイズは生きることになります。
＊参考：
WordPressテーマをカスタマイズするなら子テーマを使った方が良い理由、使い方など
子テーマの入手方法
子テーマが必要なことはわかりましたが、どうやって手に入れたらいいのでしょう？
方法は２つあります。
１．配布されている既存の子テーマを使う
配布されている（親）テーマの中には、もうすでに子テーマが準備されているものもあります。
その場合の子テーマの設定は簡単です。
子テーマをダウンロードしてインストールして有効化するだけです。
２．新しく子テーマを作る
使っているテーマに子テーマが準備されていない場合、新しく作成する必要があります。
子テーマの作り方を検索すると、とても簡単、すぐできると書いているサイトが多く出てきますが、それみてもできませんでした…(T_T)
子テーマディレクトリ？？
FTPツール？？
UTF-8？？
…撃沈です(T_T)
しかしエックスサーバーの場合、FTPソフトがなくてもサーバーの管理画面から直接 子テーマのファイルを追加・修正することができるとわかりました。
エックスサーバーを利用している方はこのやり方が分かりやすいと思います。
たのちんの子テーマ準備方法
子テーマ…というか、テーマファイルのカスタマイズは本当にややこしいです。
分かっている人にとってはなんのことはないことでも、免疫がない人間にとっては三途の川で石を積み続けるみたいな所業です。笑
やってみたいな～と思ったカスタマイズはいろいろありましたが、よくわからず結局たくさん断念しました。
追々、自分のスキルアップとともに再チャレンジしていきたいです。もしくは、お金に余裕さえできればプロにお願いしたいです。笑
わたしも自分で行ったカスタマイズ以外はアウトプットしようがありませんので、そこだけでもしっかり記録しておこうと思います。
たのちんは以下のような段取りで子テーマの準備とカスタマイズをしました。
１．STINGERの子テーマ「SIMPLESTER」をインストール
たのちんが採用しているテーマ「STINGER」には「SIMPLESTER」という子テーマがありました。
「SIMPLESTER」は、カスタマイズ専用の空のテンプレートファイルではなくて、もうすでにスタイルシート（style.css）（見た目のカスタマイズをするときに使うテンプレートファイル）に加工が施してあるので、導入するだけでばっちり素敵になってしまう優れものの子テーマです。
BEFORE：STINGER5
AFTER：SIMPLESTER-Ver5
「SIMPLESTER」をインストールして有効化するだけで、たいぶ見た目が変わります。
＊【子テーマ】STINGERの子テーマ「SIMPLESTER」のインストール方法
２．エックスサーバーのサーバーパネルから必要なテンプレートファイルを追加
子テーマ「SIMPLESTER」には、見た目のカスタマイズをするためのスタイルシート（style.css）しかテンプレートファイルがありません。
他の部分のカスタマイズもしたいので、必要なテンプレートファイルを追加します。
冒頭でサイドバーのカスタマイズもしたいと言いましたね。
サイドバー（sideber.php）というテンプレートファイルが必要ですから、子テーマの中に追加します。
＊【子テーマ】エックスサーバーで子テーマのテーマフォルダを作成する
３．新しく作った子テーマにカスタマイズを行う
「SIMPLESTER」という子テーマをインストールして、必要なテンプレートファイルが用意できたら、いよいよカスタマイズの開始です。
カスタマイズを行う前のバックアップやテストなどについてのたのちんの考え方は、
にも記載しています。
実際にたのちんに施してあるカスタマイズのやり方については下にまとめます。
＊たのちんが行ったプラグインなしのブログカスタマイズ
もう一息です(*´ω｀)♪
NEXT
＊【子テーマ】STINGERの子テーマ「SIMPLESTER」のインストール方法