1. TOPTOP
  2. Webサービス

WordPressの開発環境によって子テーマで使用するfunctions.phpの書き方が違う。

Wapuu

【お知らせ】


まことにおそれいります。下記の記事については、内容に誤りが含まれています。訂正の記事はこちら(新しいタブで開く)にまとめていますので、よろしくお願い申し上げます。

いま、ローカル開発環境と仮想専用サーバ(VPS)でWordPressの子テーマを試しています。すると、子テーマのスタイルシートを適用させるためには、必ずしもCodexで書かれているfunctions.phpを記述しても適用されないことに気がつきました。

本来であれば、「なぜ違いが生じるのか?」ということを追究した方がいいのでしょう。でもそこまでは頭が回らないので、個別具体的に対処療法を記録しておきます。

internet-594148_1280

ローカル開発環境の場合

WordPress専用のローカル開発環境であるWocker(新しいタブで開く)で、WordPressの子テーマを適用するときの書き方です。

style.css

/*
 Theme Name:   Twenty Twelve Child
 Template:     twentytwelve
*/

functions.php

add_action( 'wp_enqueue_scripts', 'theme_enqueue_styles' );
function theme_enqueue_styles() {
    wp_enqueue_style( 'parent-style', get_template_directory_uri() . '/style.css' );
}

Wockerの場合は、Codex(新しいタブで開く)に書かれているとおりの書き方で、そのまま子テーマが適用されます。

仮想専用サーバ(VPS)の場合

特にWordPress専用というわけではありませんが、さくらのVPS(新しいタブで開く)(仮想専用サーバ)でWordPressの子テーマを適用するときの書き方です。

style.css

/*
 Theme Name:   Twenty Twelve Child
 Template:     twentytwelve
*/

functions.php

function child_theme_styles() {
	wp_dequeue_style( 'match-style' );
	wp_enqueue_style( 'parent-style', get_template_directory_uri() . '/style.css' );
	wp_enqueue_style( 'child-style', get_stylesheet_uri(), array('parent-style'), '1.0.1' );
}

add_action( 'wp_enqueue_scripts', 'child_theme_styles', 20 );

notnil creation weblog(新しいタブで開く)さんの記事を参考にさせていただきました。ありがとうございます。Wockerのときと比べて、fucnctions.phpの書き方が異なります。より丁寧に親テーマ、子テーマの適用について記述されていると思います。

対処療法で使い分け

本来であれば、「なぜローカル開発環境とVPSで記述が違うのか?」ということを考えなければなりません(繰り返しでおそれいります)。ただ、一人でぐぐって考えてもムダに時間を消耗しそうなので、とりあえず現象と対処療法だけメモしておきます。

〔参考サイト〕