この投稿は、このスレッドとこのスレッドで持ち込まれたスタイルシートのエンキューメソッドに関する最近の変更に関して私が遭遇したいくつかの質問を持ち出します。
私が遭遇した問題は、WP 4.0のインストールで特に子テーマに対応している、広く使用され維持されている親テーマを使用して、一般的なユースケースシナリオで発生しました。私の子テーマのfunctions.phpには、Codexに詳述されている関数のみが含まれていwp_enqueue_styleます。
以下で参照するコードはこのテーマに固有のものですが、その多くは親テーマで使用されている現在のコーディング規則を使用しています。さらに、私の関心領域は、現在広く普及している多数の確立された親テーマで重複している可能性が高いです。また、これらの提起された質問は、どの親テーマが使用されているかに関係なく、普遍的なレベルで適用できます。
問題1：Twoqueueing
推奨セットアップ：
親テーマは、wp_enqueue_scriptsフックを使用してスタイルとスクリプトをキューに入れることです。関連する部分は次のとおりです。
add_action('wp_enqueue_scripts', 'parent_theme_function_name');
function parent_theme_function_name() {
wp_register_style( 'avia-style' , $child_theme_url."/style.css", array(), '2', 'all' );
wp_enqueue_style( 'avia-base');
if($child_theme_url != $template_url) { wp_enqueue_style( 'avia-style'); }
}
私の子テーマfunctions.phpは、最近のコーデックスの変更ごとにスタイルをエンキューします。
add_action( 'wp_enqueue_scripts', 'enqueue_parent_theme_style' );
function enqueue_parent_theme_style() {
wp_enqueue_style( 'dm-parent-style', get_template_directory_uri().'/style.css' );
}
参照コードで使用されている次のIDに注意してください。
id='dm-parent-style-css'子テーマ関数によってエンキューされた親テーマのスタイルシートですid='avia-style-css'親テーマ関数によってエンキューされた、私の子テーマのスタイルシートですid='dm-child-style-css'私の子テーマの関数によってエンキューされた、私の子テーマのスタイルシートです
結果：
一見すると、<head>は次の順序で表示され、すべて順調でした。
<link rel='stylesheet' id='dm-parent-style-css' href='testinstall.dev/wp-content/themes/enfold/style.css?ver=4.0' type='text/css' media='all' />
<!-- Multiple individual parent theme styles here -->
<link rel='stylesheet' id='avia-style-css' href='testinstall.dev/wp-content/themes/child-theme/style.css?ver=2' type='text/css' media='all' />
プラグインをインストールした後、エンキューの順序が次のように変更されました。
<link rel='stylesheet' id='dm-parent-style-css' href='testinstall.dev/wp-content/themes/enfold/style.css?ver=4.0' type='text/css' media='all' />
<!-- Multiple individual parent theme styles here -->
<link rel='stylesheet' id='avia-style-css' href='testinstall.dev/wp-content/themes/child-theme/style.css?ver=2' type='text/css' media='all' />
<!-- Pesky plugin styles -->
最終的に、プラグインの後に子テーマのcssをロードする必要があるため、子テーマの関数に優先番号を追加する必要がありました（優先番号に関する前述の説明を参照）。
ただし、私の関数は親テーマのcssのみをエンキューするため、結果として、親テーマの cssが最後に移動し、子テーマのcssが以前よりもさらに悪い状況に置かれます。
<!-- Multiple individual parent theme styles here -->
<link rel='stylesheet' id='avia-style-css' href='testinstall.dev/wp-content/themes/child-theme/style.css?ver=2' type='text/css' media='all' />
<!-- Pesky plugin styles -->
<link rel='stylesheet' id='dm-parent-style-css' href='testinstall.dev/wp-content/themes/enfold/style.css?ver=4.0' type='text/css' media='all' />
ここで、子テーマスタイルのエンキューにも頼らなければなりません。これは、それが行の先頭に戻されることを確実にするために、前述の2つのキューイング（新しい用語？lol）の子テーマcssの問題を引き起こします。
非推奨のセットアップ：
子テーマの改訂された機能：
add_action( 'wp_enqueue_scripts', 'enqueue_parent_theme_style', 99 );
function enqueue_parent_theme_style() {
wp_enqueue_style( 'dm-parent-style', get_template_directory_uri().'/style.css' );
wp_enqueue_style( 'dm-child-style', get_stylesheet_directory_uri().'/style.css' );
}
結果：
で次の順序を生成します<head>。
<!-- Multiple individual parent theme styles here -->
<link rel='stylesheet' id='avia-style-css' href='testinstall.dev/wp-content/themes/child-theme/style.css?ver=2' type='text/css' media='all' />
<!-- Pesky plugin styles -->
<link rel='stylesheet' id='dm-parent-style-css' href='testinstall.dev/wp-content/themes/enfold/style.css?ver=4.0' type='text/css' media='all' />
<link rel='stylesheet' id='dm-child-style-css' href='testinstall.dev/wp-content/themes/child-theme/style.css?ver=2' type='text/css' media='all' />
子スタイルシートを関数に含めると2回キューに入れられましたが、親テーマが子スタイルシートを適切にキューに入れるという前提の下でコーディングよりもIMHOの方が適しています。エンキューされた各スタイルに割り当てられたIDに基づいて、WP Coreの何もではなく、親テーマがエンキューしたように見えます。
私のShivm：
これが推奨される手段であることはほとんどお勧めしませんが（そして、私がこのソリューションでうめき声よりも多くのコーディング経験を持つ開発者は確実に）、自分のエンキューのすぐ上に親テーマのID（子テーマのスタイルのエンキューに使用されます）をデキューしました次のように私の子テーマの関数ファイルで：
add_action( 'wp_enqueue_scripts', 'enqueue_parent_theme_style', 99 );
function enqueue_parent_theme_style() {
wp_enqueue_style( 'dm-parent-style', get_template_directory_uri().'/style.css' );
wp_dequeue_style( 'avia-style' );
wp_enqueue_style( 'dm-child-style', get_stylesheet_directory_uri().'/style.css' );
}
結果：
これにより問題が解決され、次の結果が得られました。
<!-- Multiple individual parent theme styles here -->
<!-- Plugin styles -->
<link rel='stylesheet' id='dm-parent-style-css' href='testinstall.dev/wp-content/themes/enfold/style.css?ver=4.0' type='text/css' media='all' />
<link rel='stylesheet' id='dm-child-style-css' href='testinstall.dev/wp-content/themes/child-theme/style.css?ver=2' type='text/css' media='all' />
もちろん、これには親テーマで使用されるIDを知る必要がありました。標準の子テーマ開発方法論として使用するには、より一般的なものが必要になります。
問題2：再配置された子スタイルシート
（これが別のスレッドで出て来なかったとは信じられないようですが、探しているときに特定のスレッドが表示されませんでした...見逃した場合は、遠慮なくお知らせください。）
私は決してデフォルトを使用しないstyle.cssことが明らかに存在しなければならないが、すべて私の実際のスタイルは/ CSS /ディレクトリ内の.css縮小さファイルとしてSCSSからコンパイルされている-私のテーマスタイルの子テーマのルートディレクトリに。これは、子供向けテーマ開発の普遍的なレベルでは「期待される基準」ではないことに気づきましたが、私が知っている最も深刻なWordPress開発者は同様のことをしています。もちろん、これは、親テーマがスタイルシートをエンキューしたかどうかに関係なく、自分の関数でそのスタイルシートを手動でエンキューする必要があります。
まとめると...
- 子テーマの標準の観点から、親テーマが子テーマスタイルを適切にエンキューするという仮定を含めることは安全ですか？
- 優先順位を削除すると、WordPressコミュニティの一部で混乱が生じる可能性があります。子テーマスタイルがプラグインによって上書きされ始める場合です。私たちはテーマがスタイルを上書きすることを期待していますが、プラグインではそれほどではありません。
- 実際の子テーマスタイルにカスタムスタイルシートを使用する場合（事前定義されたに
style.css配置することになっています）、そのファイルを手動でキューに入れる必要があります。幅広い開発者に渡って継続性を維持するという点では、重複の可能性に関係なく、子スタイルシートを手動でエンキューすることを奨励することは理にかなっていますか？