WEBマスターのお仕事TOP > スポンサー広告 > [WP]Twentytenの子テーマを使うWEBマスターのお仕事TOP > WordPress > [WP]Twentytenの子テーマを使う

スポンサーサイト

(--/--/--)
上記の広告は1ヶ月以上更新のないブログに表示されています。
新しい記事を書く事で広告が消せます。

[WP]Twentytenの子テーマを使う

(2011/03/09)
WordPressの「ワ」の字も分からずにカスタマイズを始めた鎌倉スパイラルのサイトなわけですが、結果的にtwentytenを親テーマとしてスパイラル用の子テーマを作成するという形になりました。これ簡単に言うと、基本的には親テーマ(twentyten)の構造/デザインを利用して、変えたい部分だけ別途CSSなりPHPに手を加えるというやり方です。
なぜこの子テーマを利用するやり方にしようと思ったかは、初めから何かしらの形があるものをいじった方が、どこを変えたらどうなるというのが見えてやり易いかな~と思ったからです。これがベストな方法だったのかはわからないです。とあるデザイナーさんは自分でスクラッチで作る方が全然ラク!と言ってました。

そんな子テーマですが、始めは何も知らずtwentyten(親テンプレート、/wp/wp-content/themes/twentyten配下)を直接編集していましたが、これをやっちゃうと痛い目に合うのですねぇ~(WP超初心者とはワタクシです)。そう、度々あるWordPressのアップデートの度に、親テーマはデフォルトのテーマで上書きされてしまうのです。子テーマを作成する際はテンプレートをカスタマイズする際は、本家サイトの説明をちゃんと読んで、/theme/配下に子テーマ用のディレクトリを作り、ファイルを置く用にしましょう。
theme配下に子テーマ用のディレクトリを作ろう
上の画像の場合は「spiral_twentyten」というディレクトリを作成して、style.cssとテンプレートファイルを置きました。ディレクトリ名は任意でOKみたいです。spiral_twentyten配下に最終的に作ったファイルは以下でした。
子テーマ用のファイル
attachment.php、category.php、custom_link.php、footer.php、front-page.php、functions.php、header.php、loop.php、onecolumn-page.php、page.php、single.php、style.css。
もしかしたら、変更していないテンプレートもあるかも。
※front-page.phpはTOPページ用にpage.phpをコピーして作成しました。TOPページにだけ新着情報を表示させたかったため、テンプレートを個別にする必要がありました。新着情報の表示は別途紹介予定。
※functions.phpはtwentyten/のコピーではなく、差分のみを記述したファイルを置く。

子テーマを利用する際に最低限必要なファイルがstyle.cssで、このstyle.cssの冒頭の「Theme Name」を以下のように名前を変えると

Theme Name: Twenty Ten

Theme Name: 鎌倉スパイラル

管理画面>テーマの編集
で、子テーマのstyle.cssを選べるようになります。
Theme Nameを付ける
※管理画面の色が変なのはColor Schemesというプラグインで色付けしてあるからです。WordPressのサイトを複数管理している場合に便利。

子テーマを利用する際のポイントを整理すると・・・

  • /wp/wp-content/theme配下に任意名のディレクトリを作成する

  • style.cssの「Theme Name」に任意の名前(日本語OK)を付ける

  • function.phpだけは親テーマのディレクトリのファイルを見る仕様になっている

といったとこでしょうか。
間違いあればご指摘いただけますと幸いです。
関連記事

コメント

コメントの投稿

サイト管理者にのみ通知する

トラックバックURL

http://goodjob4604.blog103.fc2.com/tb.php/97-70750e80
月別アーカイブ
Google+
Twitter
ページトップへ
ブログパーツ
上記広告は1ヶ月以上更新のないブログに表示されています。新しい記事を書くことで広告を消せます。