web-dev-qa-db-ja.com

子テーマの優先ロードファイルcss

他のファイルCSSを子テーマに追加しようとしています。私は子テーマのstyle.cssファイルを持っていますが、それはデフォルトでロードされているので、頭に追加する必要はありませんでした。レスポンシブデザイン用に他のcssファイルを追加したいのですが、優先順位を設定できません。それらは最初に頭の中にロードされるので、それらは他のファイルによって上書きされます。これは私が頭にmedia-1100.cssをロードするためにfunction.phpに追加したコードです:

wp_enqueue_style( 'media-1100', get_stylesheet_directory_uri() . '/css/media-1100.css');

だから私はmedia-1100.cssファイルを頭の中で最後にロードする必要があります。私は優先順位をつけるためにfunction.phpでadd_actionを使わなければならないと読んだことがありますが、うまくいきません、私のコードは間違っています。手伝って頂けますか?ありがとう

1
maria russo

他のスタイルシートファイルに依存するため、最後にロードする必要があると思います。その場合、Wordpressでこれを行うための推奨される方法は、wp_enqueue_styleで「dependencies」パラメーターを使用することです。

依存関係を設定します

wp_enqueue_styleは、スタイルシートが依存するスタイルシートのhandlesの配列を受け入れます。

$dependencies = array('child-style', 'another-style');
wp_enqueue_style( 'media-1100', get_stylesheet_directory_uri() . '/css/media-1100.css', $dependencies);

ハンドルを見つける

ハンドルは、wp_enqueue_style-に渡される最初のパラメーターです。たとえば、質問では、ハンドルはmedia-1100です。

自分で設定しなかった場合でも、ページのソースを表示すると、すべてのスタイルシートのハンドルを見つけることができます-ハンドルはidですが、-cssは削除されています。たとえば、次のIDは「twentyfifteen-style-css」であるため、ハンドルはtwentyfifteen-styleです。

<link rel='stylesheet' id='twentyfifteen-style-css'  href='http://www.example.com/assets/themes/twentyfifteen/style.css' type='text/css' media='all' />

詳細については、 Wordpress Developer Resources をご覧ください。

3
FluffyKitten