[ 解決済 ] 投稿リストの記事の有無で見出しの表示非表示をさせたい

VWSとは フォーラム Katawara [ 解決済 ] 投稿リストの記事の有無で見出しの表示非表示をさせたい

[ 解決済 ] 投稿リストの記事の有無で見出しの表示非表示をさせたい

  • このトピックには2件の返信、2人の参加者があり、最後にfan23により2ヶ月、 2週前に更新されました。
3件の投稿を表示中 - 1 - 3件目 (全3件中)
  • 投稿者
    投稿
  • #62656

    fan23
    参加者

    ■ WordPress のバージョン
    5.9

    ■ テーマ・プラグインは全て最新版で確認してください。
    確認しました。

    ■ テーマの種類
    Katawara

    ■ テーマのバージョン
    1.11.1

    ■ 関連しそうなプラグインを一つづつ停止して症状が改善するか確認してください。
    確認しました。

    ■ 期待する動作
    サッカークラブの選手一覧を作りました。
    カスタム投稿タイプで「学年」というカスタム分類名を作り、1年〜6年まで選手に割り当てています。

    固定ページに学年ごとの一覧を掲載しています。
    ・6年生(見出し)
    ・6年生一覧(投稿リスト)
    ・5年生(見出し)
    ・5年生一覧(投稿リスト)
    以下1年生まで続く、と作りました。
    6年生が卒業してゼロになった場合、6年生(見出し)が記事数に連動して非表示にしたいのです。
    このようなことは可能でしょうか。

    ■ 自分で試した事
    Katawaraの機能でどうにかできるか調べましたが見つけられずでした。

    ■ 症状が発生するブラウザ
    Firefox、Chrome

    ■ 実際の症状
    記事は0ですが、見出しは残っています。

    #62713

    以下のようにして、見出しを非表示にできました。

    【手順①】

    グループブロックに
    * 投稿リスト
    * 見出し(H2)
    の順に入れる。

    グループブロックに 追加 CSS クラス「year-group」を指定する。

    これを学年ごとに作る。

    今回やりたいことのために、あえて見出しを後に配置します。

     

    【手順②】

    以下の CSS を追加する。

    .year-group .alert-warning,
    .year-group .alert-warning + h2 {
        display: none;
    }
    
    .year-group .wp-block-group__inner-container {
        display: flex;
        flex-direction: column-reverse;
    }

    CSS の隣接セレクタを使って 投稿リスト の後ろの 見出し を非表示にしています。

    そして、フレックスボックスを使って 投稿リスト と 見出し の位置を入れ替えています。

     

    コンテンツの後に見出しがあるのは SEO 的にどうよ?なんてことは気にしないようにお願いします (^^♪
    もしそれが心配なら、見出しの代わりに段落を使えばいいですね。

    #62714

    fan23
    参加者

    対馬さま
    ありがとうございます!できました!
    .alert-warningで判定、アイデアですね!
    本当に助かりました。ありがとうございました!

3件の投稿を表示中 - 1 - 3件目 (全3件中)
  • このトピックに返信するにはログインが必要です。