自身でテーマを一から作れる方はそんなに気にしないとは思いますが、
これいいな。っていうテーマを元にカスタマイズしたい事はよくあります。
元テーマを直接編集すると、更新があった場合に、
自身のカスタマイズ分が無くなってしまいますし、
情報量が膨大ですので、ベースとなるテーマの子テーマを作成しましょう。
テーマについて
まず、「wp-contents/themes/」 の中はどうなっているのでしょうか？
themes |-twentytwelve | |-style.css | |-*.php | |-... |-twentythirteen | |-style.css | |-... |-twentyfourteen | |-style.css | |-...
テーマとして認識させるには、themesの中に、ディレクトリと、「style.css」が存在していれば、
WordPress上からテーマとして認識できます。
style.css には表示される内容が、コメントとして入力されています。
/*
Theme Name: Twenty Twelve
Theme URI: http://wordpress.org/themes/twentytwelve
Author: the WordPress team
Author URI: http://wordpress.org/
Description: The 2012 theme for WordPress is a fully responsive theme that looks great on any device. Features include a front page template with its own widgets, an optional display font, styling for post formats on both index and single views, and an optional no-sidebar page template. Make it yours with a custom menu, header image, and background.
Version: 1.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Tags: light, gray, white, one-column, two-columns, right-sidebar, fluid-layout, responsive-layout, custom-background, custom-header, custom-menu, editor-style, featured-images, flexible-header, full-width-template, microformats, post-formats, rtl-language-support, sticky-post, theme-options, translation-ready
Text Domain: twentytwelve
This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned with others.
*/
body {
line-height: 1;
}
...「Theme Name」の後ろに入力されている「Twenty Twelve」が表示される名前です。
他にも、作成者や、バージョン等を記述しています。
phpファイルとしては、 single.php や様々な物がありますが、
今回は新規作成が目的ではない為、割愛します。
子テーマを作成する
単純な、テーマの構造を理解してもらった所で、子テーマを作成しましょう。
今回は、「Twenty Twelve」の子テーマ「My Twenty Twelve」を作成します。
「themes」にディレクトリを作り、style.cssを設置します。
themes
|-twentytwelve
|-my_twentytwelve
|-style.css
style.css
/*
Theme Name:My Twenty Twelve
Template: twentytwelve
*/
@import url('../twentytwelve/style.css');このCSS設定では、
・テーマ名 My Twenty Twelve ・親テーマ twentytwelve ・CSS設定 「twentytwelve」からインポート
と言う設定です。template の設定は、ディレクトリ名である事に注意して下さい。
名前ではありません。
「@import」を使用していますが、再利用・カスタマイズしようという事ですから、
まずインポートを行い、さらに上書く場合はそれ以降に記述するとＯＫです。
これで、子テーマ自体が作成されました。
phpファイルをカスタマイズする
phpファイルの適用は、まず子テーマ。そこになければ親テーマへ行くので、
書き換えたいファイルのみコピーしてカスタマイズが可能です。
single.php をカスタマイズしたいとなれば、
親テーマにある single.php を子テーマのディレクトリにコピーして、
そのファイルをカスタマイズして下さい。
ただし、functions.phpに関しては注意が必要です。
子 → 親テーマの順で functions.phpを解釈しますので、
関数の二重定義等でエラーを起こしたりします。
これを解決するには・・・。
どうやっても、親テーマのfunctions.phpを触る必要があります。
正しくは、親テーマ側で「function_exists」関数でチェックし、
子テーマで定義されていなければ定義と言うように実装すべきですが、
元テーマ作成者全員がチェックをしているとは限りません。
（デフォルトのテーマなどは、チェックされています。）
参照するディレクトリを使い分ける
子テーマにした事で、想定するディレクトリが２個になってしまいました。
親テーマのイメージも使いたいし、子テーマにのみ追加したイメージを使いたい！
そんな時は、パスを得る為の関数がありますので以下を使用して下さい。
親テーマのディレクトリが欲しい場合
get_template_directory_uri()子テーマのディレクトリが欲しい場合
get_stylesheet_directory_uri()基本的に、カスタマイズして使用する場合は、これで十分かと思います。
子テーマ作成の参考になればと思います。