サポート » テーマ » 投稿ページのみ特定のCSSファイルを読み込ませたい

  • 解決済 saeka

    (@saeka)


    固定ページとは別に投稿ページの全て(固定ページは含まない)に、テーマのディレクトリ直下に置いたsingle.cssを読み込ませたいので、function.phpに以下のように記述しましたが、何故か読み込まれません。

    
    // 投稿ページだけsingle.cssを読み込ませる
    function single_styles()  {
      if ( is_single() ) {
        wp_enqueue_style( 'single_style', get_stylesheet_directory_uri() . '/single.css' );
        }
      }
    add_action( 'wp_enqueue_scripts', 'single_styles' );
    

    どこか間違っているでしょうか?
    ぜひご教示いただければと思います。よろしくお願い致します。

5件の返信を表示中 - 1 - 5件目 (全5件中)
  • ifnoob

    (@ifnoob)

    こんばんわ。
    WordPressへのエンキュー(登録)が上手く言っていない様です。以下の wp_register_style をしてその後、wp_enqueue_style してみて下さい。

    wp_register_style( 'single_style', get_stylesheet_directory_uri() . '/single.css', array(), '', 'all', false );
    wp_enqueue_style( 'single_style' );
    • この返信は8ヶ月前にifnoobが編集しました。
    Aki Hamano

    (@wildworks)

    @saeka さん

    こんにちは。
    単純に構文エラーだからだと思います。

    // 投稿ページだけsingle.cssを読み込ませる
    function single_styles()  {
      if ( is_single() ) {
        wp_enqueue_style( 'single_style', get_stylesheet_directory_uri() . '/single.css' );
        } // ← このカッコがいらない
      }
    add_action( 'wp_enqueue_scripts', 'single_styles' );
    トピック投稿者 saeka

    (@saeka)

    お二人ともありがとうございます。
    以下のコードでCSSを反映させることができました!

    // 投稿ページだけsingle.cssを読み込ませる
    function single_styles()  {
      if ( is_single() ) {
        wp_enqueue_style( 'single_style', get_stylesheet_directory_uri() . '/single.css' );
        }
      }
    add_action( 'wp_enqueue_scripts', 'single_styles' );
    wp_register_style( 'single_style', get_stylesheet_directory_uri() . '/single.css', array(), '', 'all', false );
    wp_enqueue_style( 'single_style' );
    
    Aki Hamano

    (@wildworks)

    @saeka さん

    こんにちは。

    こんにちは。
    単純に構文エラーだからだと思います。

    →失礼しました、私が書いたコードに誤りがありました。(括弧の数はあっていた)

    以下のコードでCSSを反映させることができました!
    →その書き方は正しくありません。
    デバッグログを出力する設定になっていれば、Noticeログが出力されるはずです。
    さらにこのコードだと、管理画面含めて全ページに反映されてしまわないでしょうか。

    改めて検証してみましたが、当初ご質問に記載されたコードのままで正しく動作するはずだと思います。

    トピック投稿者 saeka

    (@saeka)

    @wildworks さん

    お返事いただきありがとうございます。

    // 投稿ページだけsingle.cssを読み込ませる
    function single_styles()  {
      if ( is_single() ) {
        wp_enqueue_style( 'single_style', get_stylesheet_directory_uri() . '/single.css' );
        }
      }
    add_action( 'wp_enqueue_scripts', 'single_styles' );
    // wp_register_style( 'single_style', get_stylesheet_directory_uri() . '/single.css', array(), '', 'all', false );
    // wp_enqueue_style( 'single_style' );
    

    こちらのように、コメントアウトしてみて挙動を確認したところ、CSSは適用されていて、「???」となっていたので、追加でアドバイスをいただいてとても助かりました。

    もしかするとCDNを使用しているので、反映に時間がかかるのかもしれないと考えています。
    (スーパーリロードを使用しても、反映されない時があるので)

    今回の質問の内容とは違うところに問題があるのかもしれません。

    いずれにしろ、以下の部分は削除しておきました。

    
    // wp_register_style( 'single_style', get_stylesheet_directory_uri() . '/single.css', array(), '', 'all', false );
    // wp_enqueue_style( 'single_style' );
    

    今は問題なくCSSは投稿ページのみに反映されて、Topページなどの固定ページには反映されていません。そのため、悩んでいたCSSが適用されないという点は解消できました。
    ありがとうございました。

    • この返信は8ヶ月前にsaekaが編集しました。
    • この返信は8ヶ月前にsaekaが編集しました。
5件の返信を表示中 - 1 - 5件目 (全5件中)
  • トピック「投稿ページのみ特定のCSSファイルを読み込ませたい」には新たに返信することはできません。