webdevqa.jp.net

完全なwp_enqueue_style()を使用しているのになぜwp_register_style()が重要なのですか?

現在私はテーマに取り組んでいて、いくつかのスタイルとスクリプトをエンキューしました。スクリプトをエンキューするときは、最初にwp_register_script()を使用し、次にwp_enqueue_script()を使用してエンキューしました。これが、スクリプトをエンキューするための適切な方法だからです。しかし、スタイルをキューに入れる際に、私はwp_enqueue_style()だけをすべてのパラメータと共に使用しました。しかし今、私はs_ha_dumから 回答 を得ました。wp_register_style()を使うことでテーマの子供はテーマに優しくなると思います - wp_register_style()なしでwp_enqueue_style()そして私のテーマはエンキューされたスタイルでうまく機能しています。私はそれらを次のようにエンキューしました:

add_action( 'wp_enqueue_scripts', 'wpse20131025_styles' );

function wpse20131025_styles(){

    wp_enqueue_style( 'site-styles', get_template_directory_uri() . '/style.css', '', '', 'screen' );
    wp_enqueue_style( 'menu-styles', get_template_directory_uri() . '/css/menu.css', '', '', 'screen and (min-device-width: 800px)' );
    wp_enqueue_style( 'mobile-menu-styles', get_template_directory_uri() . '/css/mobile-menu.css', '', '', 'screen and (max-device-width: 799px)' );

}

wp_enqueue_style()wp_register_style() $ handle、$ src、$ deps、$ ver、$ media )にあるすべてのパラメータを持っていますが、なぜそれらを繰り返すべきなのでしょうか?または、wp_register_style()以外のwp_enqueue_style()の目的は何ですか?

16
Mayeenul Islam

まず第一に、これらの関数に関して、スタイルに有効なものはスクリプトに正確に有効であると言いましょう。しかし、その答えに説明されている反対の例外がいくつかあります。

wp_enqueue_*とそれぞれのwp_register_*関数の主な違いは、最初のスクリプトがスクリプト/スタイルをキューに追加し、2番目のscripts /スタイルを追加することです。

あなたはおそらくすでにそれを知っています、しかし第二の違いがあります。 initのような早いフックであっても、すべてのフックでwp_register_*を使用できますが、wp_enqueue_*wp_enqueue_scriptsフックで使用する必要があります(またはバックエンドではadmin_enqueue_scripts) 1

両方の機能を使用する典型的なシナリオは、テーマinitにスクリプト/スタイルを登録して、それをいくつかのページで条件付きでエンキューしたい場合です。

add_action('init', 'my_register_styles');

function my_register_styles() {
    wp_register_style( 'style1', get_template_directory_uri() . '/style1.css' );
    wp_register_style( 'style2', get_template_directory_uri() . '/style2.css' );
    wp_register_style( 'style3', get_template_directory_uri() . '/style3.css' );
}

add_action( 'wp_enqueue_scripts', 'my_enqueue_styles' );

function my_enqueue_styles() {
    if ( is_front_page() ) {
        wp_enqueue_style( 'style3' );
    } elseif ( is_page_template( 'special.php' ) ) {
        wp_enqueue_style( 'style1' );
        wp_enqueue_style( 'style2' );
    } else {
        wp_enqueue_style( 'style1' );
    }
}

このようにして、条件付きエンキューは読みやすくなり、冗長さも少なくなります。

さらに、バックエンドでも1つ以上の登録済みのスタイル/スクリプトをエンキューしたい場合は、すべてのパラメータを渡さなくてもadmin_enqueue_scriptsをフックする関数で登録済みのハンドルを使用できます。

wp_localize_scriptは、スクリプトの登録後に1回呼び出すことができます。条件付きエンキューでは、スクリプトが複数回使用されていてもエンキューするだけです。これにより、コードが単純化され、DRYが維持されます。

スクリプト/スタイルを登録した直後、それをエンキューした直後は、これは不必要な作業です。実際、これは完全に回避できます。

wp_register_style( 'style1', get_template_directory_uri() . '/style1.css' );
wp_enqueue_style( 'style1' );

このようにスタイル(またはスクリプト)をエンキューすることに利点はありません。単にwp_enqueue_styleのすべてのパラメーターと一緒にwp_enqueue_styleを使用すれば完了です。

前の文はまた子供のテーマの友情に関しても当てはまります。子テーマでスタイルを上書きするには、親がwp_register_styleの直後にwp_enqueue_styleを続けて使用しているときに、そのスタイルを登録解除して別のURLに再度登録する必要があります。親がwp_enqueue_styleのみを使用している場合、子テーマでは wp_dequeue_style を使用して新しいスタイルをエンキューできます。したがって、子テーマではどちらの場合も2行のコードが必要です。

しかし、子テーマにとって非常に親切なのは、スタイルとスクリプトをエンキューまたは登録する関数をif ( ! function_exists( ...にラップすることです。この方法で、子テーマは親テーマのスタイルとスクリプトをすべて1か所で上書きできます。

if ( ! function_exists( 'my_register_styles' ) ) {
    function my_register_styles() {
        wp_register_style( 'style1', get_template_directory_uri() . '/style1.css' );
        wp_register_style( 'style2', get_template_directory_uri() . '/style2.css' );
        wp_register_style( 'style3', get_template_directory_uri() . '/style3.css' );
    }
}

if ( ! function_exists( 'my_enqueue_styles ') ) {
    function my_enqueue_styles() {
        if ( is_front_page() ) {
            wp_enqueue_style( 'style3' );
        } elseif ( is_page_template( 'special.php' ) ) {
            wp_enqueue_style( 'style1' );
            wp_enqueue_style( 'style2' );
        } else {
            wp_enqueue_style( 'style1' );
        }
    }
}

子テーマでは、スタイルを1つずつ登録解除/デキューすることなく、別のmy_register_stylesおよび/またはmy_enqueue_styles関数を記述し、すべてのスタイルを変更することができます(もちろん、必要に応じて)。


1 スクリプトやスタイルとのもう1つの違いは、次のとおりです。wp_enqueue_scriptはページの本文で使用でき(通常はショートコードで使用できます)、スクリプトはフッターに配置されます。

29
gmazzap