Amazonで商品を見る セール会場へ

SWELL│特定の条件でサイドバーを表示・非表示にするカスタマイズ

swell_hide_sidebar

対象条件に一致するときだけサイドバーの表示を変更します。対象外では元の値を返し、SWELLで設定した非表示を勝手に表示へ戻したり、全ページを非表示にしたりしないコードです。

SWELLでモバイルファーストを意識してサイドバーを非表示にしたいことがあります。

できればすでに表示されてから非表示にするCSSからではなく、元のテンプレートの設定から非表示にしたいと思います。

まずは基本設定からおさらいします。

SWELLではカスタマイズからサイドバーを非表示にする設定項目が下記の4つあります。

  • トップページ
  • 投稿ページ
  • 固定ページ
  • アーカイブ
トップページや投稿ページ、固定ページ、アーカイブなど、サイドバーの表示・非表示を設定できる標準項目の例。

しかしカスタム投稿タイプやカスタムタクソノミー、あとは特定の条件を指定しての非表示はカスタマイズが必要になります。

本記事では特定の条件でサイドバーを非表示にするカスタマイズを紹介いたします。

目次

著者

WEB制作をしているデジタルノマド
WordPressのカスタマイズが好きで、色々と自作しています。

WordPressのカスタマイズに困ったらご相談ください!

SWELLで特定の条件でサイドバーを非表示にするカスタマイズ

特定の条件でサイドバーを非表示にするカスタマイズはfunctions.phpをコードを挿入するだけです。

swell_is_show_sidebarというフックを使用しています。

以下、詳しく解説いたします。

functions.phpにコードを挿入する

コードを記述する場所は下記になります。

子テーマのfunctions.phpのPHP領域、またはCode SnippetsのPHPスニペットのどちらか1か所

変更前のコードを保存し、下記の例のうち必要なものを1つだけ登録してください。親テーマのfunctions.phpは編集しません。

また2行目にはif文を使った表示条件を記載してください。

今回はnewsというカスタム投稿タイプとplaceというカスタムタクソノミーでサイドバーを非表示にする条件を記載しています。

function motoki_swell_hide_sidebar( $is_show ) {
    if ( is_singular('news') || is_tax('place') ) {
        return false;
    }
    return $is_show; // 対象外は、表示・非表示の元の設定を維持
}
add_filter('swell_is_show_sidebar', 'motoki_swell_hide_sidebar', 20);

swell_is_show_sidebarというSWELLのフックを使用しています。

カスタマイズは以上です。

コード挿入後にサイドバーが非表示になっているか確認しましょう。

SWELLで特定の条件でサイドバーを表示にするカスタマイズ

同じやり方ですが、たとえばeventというカスタム投稿記事の場合はサイドバーを表示させてみます。

function motoki_swell_show_sidebar($is_show) {
    if (is_singular('event')) { // カスタム投稿タイプがeventの場合
        return true; // サイドバーを表示
    }
    return $is_show; // それ以外の場合は元の設定を維持
}
add_filter('swell_is_show_sidebar', 'motoki_swell_show_sidebar', 20);

トップページとお知らせの記事、アーカイブページも非表示にしたい場合

function motoki_swell_hide_sidebar( $is_show ) {
    if ( is_singular('news') || is_post_type_archive('news') || is_front_page() ) {
        return false;
    }
    return $is_show;
}
add_filter('swell_is_show_sidebar', 'motoki_swell_hide_sidebar', 20);

記事ごとの表示設定との優先順位を確認する

掲載コードのadd_filter()では、第3引数に20を指定しています。

SWELL 2.19.0では記事ごとのサイドバー設定が優先順位10のフィルターで反映されるため、その後でこの記事の条件を適用するためです。

優先順位の指定がない元のコードでは、newsを非表示にする指定が記事側の「表示」で上書きされ、eventを表示する指定も記事側の「非表示」で上書きされました。

修正後はnewsの記事側を「表示」にしても非表示になり、eventの記事側を「非表示」にしても表示されることを確認しました。

placeの一覧は非表示になり、条件に該当しない通常投稿はカスタマイザーの表示・非表示設定を維持しました。

1280pxと390pxで、newsとplaceにサイドバーがなく、eventにはウィジェットが出力されることを確認しています。

このコードより後の優先順位で別のスニペットが同じフィルターを変更すると、その結果が優先される場合があります。

対象外のreturn $is_showを残し、サイト全体へ表示・非表示を強制しないでください。

元に戻すときは追加したスニペットを停止し、記事ごとの設定とカスタマイザーの設定が再び使われることを確認します。

個別設定が非表示でもeventにサイドバーを表示
2026年10月3日撮影/WordPress 7.1.2・SWELL 2.19.0/個別設定が「非表示」のeventに、優先順位20のコードでサイドバーを表示。

まとめ

本記事では特定の条件でサイドバーを非表示にするカスタマイズを紹介いたしました。

もしサイトがモバイルがメインでサイドバーを使用しない時は、非表示の設定にすることをおすすめします。

そしてカスタム投稿タイプやカスタムタクソノミーを使用しているときは、本記事のカスタマイズをご参考ください。

この記事で紹介しているコードは、GitHubのMOTOKI-LLC/WAZA-codeにもまとめています。

対象外の設定を維持する理由と戻し方

このフィルターはtrue・falseの両方を受け取ります。条件外でreturnを書かないとnullを返し、元の表示設定を失います。条件外で常にtrueを返すと、本来非表示だったページまで表示対象になります。いずれもreturn $is_showで元の値を維持します。

newsは投稿タイプ名、placeはカスタムタクソノミー名です。is_tax(‘place’)はその分類の一覧ページであり、placeに属する個別記事を意味しません。例の名称を自分のサイトに合わせて変更してください。

同じmotoki_swell_hide_sidebar関数を使う2例は同時登録できません。変更する場合は先の例と差し替えます。戻すときは追加したフィルターを外すか、そのスニペットを無効化してください。表示をtrueにしても、ウィジェットの中身やスマホ幅の配置まで作成するものではありません。

検証記録(2026年10月1日):隔離したWordPress 7.1.2・SWELL 2.19.0環境で、news個別ページの非表示を確認しました。実際のplaceタクソノミーを登録した追加4条件でも、一覧の認識・非表示と対象外のtrue・falseの維持を確認しています。実サイトのウィジェット配置とPC・スマホの最終レイアウトは未検証です。

  • URLをコピーしました!

実装を任せたい方へ

SWELLのカスタマイズ代行

記事のコードをそのまま使うのが不安な場合や、サイトに合わせた調整が必要な場合は当社が実装します。1時間 ¥8,000〜(税込)。テーマ更新に強い書き方で納品します。

WAZAの有料記事のサブスクリプションも開始しました。

サービス

Service

WordPressサイトのカスタマイズのサービスに関心がありましたら、ぜひ詳細をご覧ください。

目次