web-dev-qa-db-ja.com

フック 'wp_enqueue_scripts'の優先順位は効果がありません

私が取り組んでいるテーマでは、最大3つのスタイルシートがあります。私はフック 'wp_enqueue_scripts'を使用しています。スタイルシートの順序は、スタイルを上書きするために重要です。私はこのようなコードがあります:

add_action('wp_enqueue_scripts', 'add_stylesheet_one', 10);
add_action('wp_enqueue_scripts', 'add_stylesheet_two', 14);
add_action('wp_enqueue_scripts', 'add_stylesheet_three', 12);

この優先順位では、スタイルシートの順序は 'stylesheet_one'、 'stylesheet_three'、 'stylesheet_two'になります。しかし優先順位は何の効果もありません。私は別の番号を試しましたが、順番は変わりません。私は何かが足りないのですか?

助けのためのTHX!

4
Markus Schober

問題は、あなたのアクションはあなたが知覚する順番で実行されていますが、スタイルはWordPressによって収集され、ランダムな順番で含まれているということです。

あなたのadd_actionsの順番は重要ではないでしょう。私はこれをするだろう:

function add_all_stylesheets() {
  // you omitted this from your question, see below
}
add_action('wp_enqueue_scripts', 'add_all_stylesheets');

今すぐ - あなたのスクリプトを順番にインクルードしたいのであれば、それらをカスケードにするためにそれらを互いに「依存させる」必要があります。

function add_all_stylesheets() {
  wp_enqueue_style( 'stylesheet-one', get_template_directory_uri() . '/css/stylesheet-one.css' );
  wp_enqueue_style( 'stylesheet-two', get_template_directory_uri() . '/css/stylesheet-two.css', array( 'stylesheet-one' ) );
  wp_enqueue_style( 'stylesheet-three', get_template_directory_uri() . '/css/stylesheet-three.css', array( 'stylesheet-two' ) );
}
add_action('wp_enqueue_scripts', 'add_all_stylesheets');

今すぐあなたの "stylesheet-2"は "stylesheet-one"に、 "three"は "two"に依存しています。

9
funwhilelost

私はそれが遅すぎることを知っています。しかし、今、それは期待どおりに機能します。

add_actionには、優先度の高い3番目の引数があります。以下では、スクリプトを優先順位10, 12 and 14でエンキューしました。そのため、指定された優先度のフロントエンドでスクリプトをエンキューします。

下に、私のスニペットがあり、それはうまく機能します。

add_action( 'wp_enqueue_scripts', 'test_enqueue_styles_1', 10 );
add_action( 'wp_enqueue_scripts', 'test_enqueue_styles_2', 14 );
add_action( 'wp_enqueue_scripts', 'test_enqueue_styles_3', 12 );

function test_enqueue_styles_1() {
    wp_enqueue_style( 'font-awesome-1-css', get_template_directory_uri() . 'assets/css/font-awesome.min.css' );
}

function test_enqueue_styles_2() {
    wp_enqueue_style( 'font-awesome-2-css', get_template_directory_uri() . 'assets/css/font-awesome.min.css' );
}

function test_enqueue_styles_3() {
    wp_enqueue_style( 'font-awesome-3-css', get_template_directory_uri() . 'assets/css/font-awesome.min.css' );
}

エンキュー順序

test_enqueue_styles_1
test_enqueue_styles_3
test_enqueue_styles_2
4
maheshwaghmare

うーん、このようにしている理由はありますか?より一般的な方法は以下の通りです。

(以下は、あなたのスタイルシートがあなたのテーマのcssディレクトリにあると仮定しています。)

function my_enqueue_scripts() {
    wp_enqueue_style( 'stylesheet_one', get_template_directory_uri() . '/css/stylesheet_one.css' );
    wp_enqueue_style( 'stylesheet_three', get_template_directory_uri() . '/css/stylesheet_three.css' );
    wp_enqueue_style( 'stylesheet_two', get_template_directory_uri() . '/css/stylesheet_two.css' );
}

add_action( 'wp_enqueue_scripts', 'my_enqueue_scripts' );

それは言った - 私はあなたの方法の優先順位がなぜうまくいかないのかわからない。おそらく添付の関数のコードを見る必要があるでしょう。

1
vancoder