Twenty Tenを1.1にアップデートしたら・・・

WordPressの管理室「ダッシュボード」において、現在使用しているテンプレートテーマ「Twenty Ten」の更新のお知らせがあったので、さっそく「1.0」から「1.1」にアップデートしてみました。アップデートはボタンをワンクリックするだけで終了。

アップデート内容については、ダッシュボード内では確認できませんでしたが、以下で確認できます。ソースコードの整理がメインで、さほど大きな変更はなかった模様です。

『WordPress.ORG』のForums「Changes Twentyten 1.0 >> 1.1」に、Twenty Tenのコードを書かれたというAndrew Nacinさんのアップデートに関する発言(英語)があります。

また、日本語で確認できるものとしては、『Odysseygate.com』に大変詳しくまとめられたものがあります。⇒Twenty Ten 1.1 の変更点とアップデートの注意点

今回のアップデートの具体的なソースコードの変更内容については、『WordPress trac』にて確認できます。

それはさておき、今回のアップデートを実行すると、腹立たしいことに以前に自分で変更を加えていた「header.php」、「footer.php」、「style.css」などがすべて新しいファイルに上書きされてしまっていました・・・。予想はできたことですが・・・。

今後もアップデートのたびに上書きされてしまってはたまったもんじゃないと、ちょっと調べてみたところ、さすがはWordPress!!うまくできていますね。『WordPress Codex』によると「子テーマ」というものを自分で設定できるようになっていて、この「子テーマ」を利用することで、「親テーマ」自体のファイルを変更することなく、デザインなどのカスタマイズができるようになっているということでした。

子テーマの設定は簡単です。基本的な設定方法は以下の通りです。

  1. FTP接続して、「wp-content/themes」内に子テーマ用のディレクトリを新たに作成する。(ディレクトリ名は任意)
  2. 作成したディレクトリに「style.css」ファイルを作成する。
  3. WordPress管理室の「外観>テーマ」に、利用可能なテーマとして表示されるので「有効化」する。

で、新たに作成したstyle.cssには、最低でも「子テーマ名」と「親テーマのディレクトリ名」がヘッダー情報として必要となります。以下を記載します。
※上記3の手順で有効化しておくと、WordPress管理室の「外観>テーマ編集」から編集できるようなります。

/*
Theme Name:Kid(子テーマ名、名称は任意)
Template:twentyten(親テーマのディレクトリ名、大文字小文字を区別する )
*/

それから、子テーマのstyle.cssは親テーマのstyle.cssをオーバライドするため、親テーマのstyle.cssをインクルードしておく必要があります。ヘッダー情報に続いて以下を記載します。

@import url('../twentyten/style.css');

作成した子テーマ用のディレクトリには、functions.phpやその他のテンプレートファイルも置くことができます。functions.phpの場合は、オーバーライドされずに親のfunctions.phpに追加されて読み込まれるということです。テンプレートファイルの場合は、同名のファイルをオーバーライドするということです。

今回のアップデートでテンプレートファイルとしてはheader.phpとfooter.phpが上書きされてしまったので、次回からは新たに作成した子テーマ用のディレクトリにheader.phpとfooter.phpをアップロードして、こちらのファイルを変更していくということになります。

そんな感じで、「子テーマ」の設定について理解を深めるためにも、もうしばらく「Twenty Ten」のお世話になりそうです。

mae の紹介

1978年茨城県水戸市生まれ とあるITベンチャーでサーバーを売ってます http://mae.chab.in/about
カテゴリー: WordPress   パーマリンク

コメントをどうぞ

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

*

次のHTML タグと属性が使えます: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong> <img localsrc="" alt="">