web-dev-qa-db-ja.com

子テーマのStyle.cssがBootstrapの前にロードされる

Bootstrapをwp_enqueue_style()でエンキューすると、Bootstrapは子テーマのstyle.cssの後にロードされ、style.cssをオーバーライドします。 Bootstrapの後にstyle.cssをロードする1つの方法は、style.cssを同様にエンキューすることですが、これは2回ロードされる原因になります。 Bootstrapの後にANDをstyle.cssにエンキューする方法はありますか？ありがとうございます。

child-themewp-enqueue-stylestylesheettwitter-bootstrap
2
newjonnydepony

ほとんどの場合、親テーマは子テーマのstyle.cssをエンキューしている可能性があります。その場合は、handleを使用してデキューしてから適切な依存関係を使用してエンキューできます。

子テーマのハンドルがchild-theme-styleであれば、それを使ってデキューします。

wp_dequeue_style('child-theme-style')

その後、必要に応じてそれをエンキューします。

wp_enqueue_style('child-theme-dep',get_stylesheet_uri(),array('bootstrap-handle-here'))

enter image description here 

添付画像のように、頭の中にあるリンクの出力を見ることで、子テーマのスタイルシートのURLを簡単に知ることができます。

<link rel='stylesheet' id='hybrid-style-css'  href='https://wptavern.com/wp-content/themes/stargazer-child-dev/style.css?ver=4.6.1' type='text/css' media='all' />

子テーマのエンキューハンドルはhybrid-styleであり、これは-cssなしのidです。

5
bravokeyl

良い知らせこれは簡単な修正です。 WordPressでは、スクリプトやスタイルシートを登録するときに依存関係を宣言できます。後でロードしたいアセットを後のアセットの依存関係としてリストするだけです。

https://codex.wordpress.org/Function_Reference/wp_register_style

これはスクリプトとスタイルの両方で機能し、ロード順序を制御するための推奨方法です。

3
jdm2112