【WP】子テーマのURLの取得方法

ある子テーマにオリジナルのCSSファイルをUPし、限定したページのみにファイルを読み込むという仕組みを作っていました。

それは、tableやdl、ulなどのタグはテーマのCSSに装飾されておらず、軽量CSSフレームワークを利用すればレスポンシブ対応にも対応しているので便利。

まずはheadタグにlinkタグを追加する仕組みをfunction.phpに以下のように組み込みました。

function head_add_css() {
/* オリジナルCSSファイルを出力 */
echo "<link rel='stylesheet' href='".get_bloginfo("template_url")."/custom.css' media='all' />";
}
add_action( 'wp_head', 'head_add_css');

ブラウザで出力しているか確認してみると、適用されていませんでした。出力はしているんですけどね・・・とhrefの中身を確認したら、なんと親テーマのディレクトリを出力していました。

get_bloginfo()でtemplate_urlを指定すると、子テーマではなく、親テーマを出すんですね。

で、他の関数を調べると、get_theme_file_uri() で大丈夫なんだそう。ちなみに、get_stylesheet_directory_uri() でも大丈夫なんだとか。

結果、ひとまずは以下の方法でfunction.phpの設定は終了としました。

function head_add_css() {
  if(is_page( Page ID )) {
    /* オリジナルCSSファイルを出力 */
    echo "<link rel='stylesheet' href='".get_theme_file_uri()."/custom.css' media='all' />";
  }
}
add_action( 'wp_head', 'head_add_css');