トップページにだけ home.css を読み込ませる
functions.php
/*----------------------------------------------------
特定のページにだけ任意のcssファイルを読み込ませる
----------------------------------------------------*/
if ( !function_exists( 'add_page_style' ) ){
function add_page_style() {
// トップページにだけ home.css を読み込ませる
// is_front_page() は、トップに固定ページを使っているサイトでもトップで true になる
if ( is_front_page() ) {
wp_enqueue_style( 'page-style-home', get_stylesheet_directory_uri() . '/css/home.css' );
}
}
add_action( 'wp_enqueue_scripts', 'add_page_style' );
}
is_home() は「投稿の一覧のページ」で true になります。「表示設定 → ホームページの表示」で固定ページをトップにしているサイトでは、トップでは true にならず、投稿の一覧のページで true になります。トップページを指すときは is_front_page() を使います(違いは別の記事にまとめています)。
特定の固定ページにpage.cssを読み込ませる場合
functions.php
// 特定の固定ページ(ID 56)に page.css を読み込ませる
if ( is_page( 56 ) ) {
wp_enqueue_style( 'page-style-page', get_stylesheet_directory_uri() . '/css/page.css' );
}
特定の記事ページに post.css を読み込ませる
functions.php
// 特定の記事ページ(ID 81)に post.css を読み込ませる
if ( is_single( 81 ) ) {
wp_enqueue_style( 'page-style-post', get_stylesheet_directory_uri() . '/css/post.css' );
}
get_the_ID() や $post->ID で比べると、一覧のページでは先頭の記事の ID になり、関係のないページでも読み込まれることがあります。404 のページでは warning も出ます。固定ページは is_page( ID )、記事は is_single( ID ) で見分けます。
条件を組み合わせて、ページごとに CSS を読み込ませる
functions.php
/*----------------------------------------------------
特定のページにだけ任意のcssファイルを読み込ませる
----------------------------------------------------*/
if ( !function_exists( 'add_page_style' ) ){
function add_page_style() {
// トップページにだけ home.css を読み込ませる
if ( is_front_page() ) {
wp_enqueue_style( 'page-style-home', get_stylesheet_directory_uri() . '/css/home.css' );
}
// 特定の固定ページ(ID 56)に page.css を読み込ませる
if ( is_page( 56 ) ) {
wp_enqueue_style( 'page-style-page', get_stylesheet_directory_uri() . '/css/page.css' );
}
// 特定の記事ページ(ID 81)に post.css を読み込ませる
if ( is_single( 81 ) ) {
wp_enqueue_style( 'page-style-post', get_stylesheet_directory_uri() . '/css/post.css' );
}
}
add_action( 'wp_enqueue_scripts', 'add_page_style' );
}

