ワードプレス：私のワードプレスのテーマに私のスタイルシートをリンクするためには、異なるページ

Question

に異なるスタイルシートをアクティブに、私は私のcustomtheme/style.cssに内部で次のようにあります

@import url('bootstrap/bootstrap.min.css'); 
@import url('includes/styles1.css'); 
@import url('includes/styles2.css'); 

は、私がstyles1.cssにロードするとし1ページだけ（ホームページと言う）、他のすべてのページでstyles2.cssを読み込みます。とにかくこれを指定するには？

Answer 1

なぜ異なるページに異なるスタイルシートを読み込むのですか？シートを最小限にすると、https://tools.pingdom.comおよび/またはhttps://developers.google.com/speed/pagespeed/insights/のスコアが向上し、読み込み時間が短縮されます。異なるページのスタイルシートで特定のクラスまたはIDをターゲットにして、あなたは金色です。

Answer 2

wp_register_styleと

wp_enqueue_style仕組み：

wp_register_styleは、あなたがあなた自身のスタイルシートを登録し、それらを自分のハンドルを与えることができます。これにより、すべてのスタイルを定義し、必要に応じてロードすることができます。多くの場合、スタイルシートはテーマのライフサイクルの早い段階で登録されていることがよくあります。その後、いくつかの論理チェックに基づいてエンキューされます。一例として、

：

あなたはいくつかのカスタムショートを持っていますが、ショート自身が実際に使用されない限り、そのスタイルシートのいずれかをロードしたくないとしましょう：

のfunctions.php

add_action('wp_enqueue_scripts', 'custom_enqueue_scripts'); 
function custom_enqueue_scripts() 
{ 
    //Register the style 
    wp_register_style('my-shortcode-styles', get_template_directory_uri() . '/css/shortcode-styles.css'); 
} 
add_action('init', 'custom_init'); 
function custom_init() 
{ 
    //Example shortcode 
    add_shortcode('my_shortcode', 'custom_shortcode'); 
} 
function custom_shortcode($atts, $content = null) 
{ 
    //If registered style isn't loaded.... 
    if (!wp_style_is('my-shortcode-styles')) { 
     //Enqueue it! 
     wp_enqueue_style('my-shortcode-styles'); 
    } 
    return 'My Shortcode!'; 
} 

ほとんどの場合でも、wp_enqueue_styleで十分です。これを使用して、あなたはすべてを一度あなたのスタイルシートを登録し、エンキューすることができますあなたの場合は

add_action('wp_enqueue_scripts', 'custom_enqueue_scripts'); 
function custom_enqueue_scripts() 
{ 
    //Register and enqueue the style 
    wp_enqueue_style('my-shortcode-styles', get_template_directory_uri() . '/css/shortcode-styles.css'); 
} 

を、ユーザーが適切なスタイルシートをロードする前に訪問されるページを決定するためにいくつかの簡単な論理チェックを実行することができます。

add_action('wp_enqueue_scripts', 'custom_enqueue_scripts'); 
function custom_enqueue_scripts() 
{ 
    if(is_home()){ //is_front_page() if you're using a Page for the home page 
     //Load only on the home page 
     wp_enqueue_style('home-styles', get_template_directory_uri() . '/css/styles1.css'); 
    } 
    //Load everywhere else 
    wp_enqueue_style('my-theme', get_template_directory_uri() . '/css/styles2.css'); 
} 

クイックノート：スタイルシートのエンキューが動作するためには、あなたのテーマMUST使用wp_headとwp_footer。アクティブなテーマでテンプレートファイルが見つからない場合、スタイルシートエンキューは動作しません。

参照：

• wp_register_script
• wp_enqueue_script