サイドバーウィジェットの特定のカテゴリーの非表示について

Simplicityの特徴 フォーラム Simplicity2に関する話題何でも サイドバーウィジェットの特定のカテゴリーの非表示について

このトピックには3件の返信が含まれ、2人の参加者がいます。10 ヶ月、 2 週間前 シン さんが最後の更新を行いました。

  • 投稿者
    投稿
  • #49227

    シン

    いつも、simplicity2を使わせていただいてるシンです。

    以前、この質問と同じトピック#41584
    がありそれについての質問です。

    そのトピックで教えていただいたコード

    .widget_categories .cat-item-13 {
      display: none;
    }

    で特定のカテゴリーを非表示にすることができたのですが非表示にしたいカテゴリーの数が20近くあった場合、このコードを20個ほど書くと、ちょっとcssが重くなってしまう感じがします。

    ですので

    .widget_categories .cat-item-13,14,15{
      display: none;
    }

    のような感じで一つのcssで複数の特定のカテゴリー(サイドバーウィジェット)を非表示にする方法はないでしょうか?

    よろしくお願いします。

  • #49243

    Hidekichi
    .widget_categories [class^="cat-item-"] {
      display: none;
    }

    とすると、.widget_categories .cat-item-何かしら が全部非表示になります。
    必要なものだけ、例えば

    .widget_categories [class^="cat-item-"] {
      display: none;
    }
    .widget_categories .cat-item-20 {
      display: block;
    }

    とすることで.cat-item-20だけ表示する事ができますが、cssで重くなるということはまず無いです。
    htmlをレンダリングする際にcssが参照されますが、htmlより前にcssは読み込まれていると思うのでdisplay: blockの部分はレンダリングされません。

    また子テーマstyle.cssに書いたものは基本ブラウザにキャッシュされるためより高速に動作するはずです。タグに直接style属性で書いていたりしていたら別ですが。

    他にも構造的にどうなっているかにもよりますが、

    #sidebar .widget_categories > * {
      display: none;
    }

    とか色々できます。全てはどのような構造になっているかです。
    * は ユニバーサルセレクタといい、全部が該当するトランプで言うジョーカー(ワイルドカード)みたいなものです。全てが該当するため重いと言われますが多用しない限りそれほど重くはなりません。また上記の場合範囲が限られているので比較的重くなることはないかと思います。

  • #49261
    わいひら
    わいひら
    キーマスター

    hidekichiさんの書いたものが、最もスッキリ書けるものだと思います。
    ただ一応、以下のような書き方もあります。ちょっとましになる程度ですが。

    .widget_categories .cat-item-13,
    .widget_categories .cat-item-14,
    .widget_categories .cat-item-15 {
      display: none;
    }

    あと、CSSのスタイルを20個くらい書いた程度では、表示は重たくならないと思います。
    何か他に原因があるのかもしれません。

  • #49398

    シン

    hidekichiさん、わいひらさんいつもお世話になっています。

    教えてもらった通りにやったらcssを短縮できました。

    ありがとうございました!

トピック「サイドバーウィジェットの特定のカテゴリーの非表示について」への新規返信追加は締め切られています。

スポンサーリンク
アドセンス(大)
アドセンス(大)