子テーマのstyle.cssの内容が反映されない


■’template_directory’が原因かも
結論:’template_directory’を’stylesheet_directory’にすれば直るかも。

このテーマ(Berlin WordPress Theme | Graph Paper Press)を親テーマにして、子テーマを作っていたんですが
 ・子テーマのstyle.cssが全く反映されない。
 ・むしろ @import url~を書いていなくても、親テーマのstyle.cssが反映されている
  →TwentyElevenを親にした場合、@import url~を書かないと、CSSが未適用の状態になる
 ・実際に表示された記事のソースを表示すると、すべて親テーマのcss(print.cssやscreen.cssも)へのパスになっている
  →TwentyElevenを親にした場合、ちゃんと子テーマへのパスになる
ので、親テーマのheader.phpを見てみた。

<link rel="stylesheet" href="<?php bloginfo('template_directory'); ?>/css/screen.css" type="text/css" media="screen, projection" />
<link rel="stylesheet" href="<?php bloginfo('template_directory'); ?>/css/print.css" type="text/css" media="print" />
<link rel="stylesheet" href="<?php bloginfo('template_directory'); ?>/style.css" type="text/css" media="screen, projection" />

あー…親テーマのCSS見に行ってるよ。
テンプレートタグ/bloginfo – WordPress Codex 日本語版によると、
 stylesheet_directory(使用中のメインCSSファイルが置かれたディレクトリのURL)(Version 2.3.1 で廃止)
 template_directory(使用中テーマファイルディレクトリのURL)(Version 1.5以降)
ということらしい。

<link rel="stylesheet" href="<?php bloginfo('template_directory'); ?>/style.css" type="text/css" media="screen, projection" />

の’template_directory’を’stylesheet_directory’に変更したら、ちゃんと反映されました。
…って、あ、親テーマのheader.php書き換えちゃってたwwwダメじゃんwww子テーマにheader.php持ってこないとダメだよね。

…codexにある”(Version 2.3.1 で廃止)”とかいうのは無視してOKと言うことなんですかね。謎。

■’template_directory’がない場合
wp.Vicuna Ext. Custom(wp.Vicuna.exc)の場合、’template_directory’が無かったので、header.phpに次の一文を追加。

<!-- 追加ここから▼子テーマのcssを読みに行く --><link rel="stylesheet" type="text/css" href="<?php echo get_stylesheet_directory_uri();?>/style.css" /><!-- 追加ここまで▲ -->

■その他
ちなみに、CSSの場合は、「子テーマにないから親テーマを見に行く」ってしてくれないみたい。
直接パスを指定してるんだから当然といえば当然?
screen.cssを子テーマに用意していない状態で’template_directory’を’stylesheet_directory’に変えたら、レイアウトが崩れた。
うーん…子テーマも難しいなあ。

Comments are closed.