# 特定のページのみヘッダーとフッターを非表示にしたい **URL:** \ **Category:** Shopify テーマ\ **Created:** [October 5, 2021, 3:00pm UTC](https://community.shopify.com/t/topic/70060 "2021-10-05T15:00:59Z")\ **Posts on this page:** 8\ **Page:** 1 ## AI-generated summary Shopify の Dawn テーマで、特定のページのみヘッダーとフッターを非表示にする方法についての質問と解決策。 **基本的な解決方法:** - `theme.liquid` ファイル内の `{% section 'header' %}` と `{% section 'footer' %}` を条件分岐で囲む - トップページ（index）を非表示にする場合: `{% if template != 'index' %}` を使用 - 特定のページを非表示にする場合: `{% if page.handle != 'ハンドル名' %}` を使用 **複数ページへの適用:** - `or` 演算子を使って複数のページハンドルを指定可能 - 例: `{% if page.handle != 'ハンドル1' or page.handle != 'ハンドル2' %}` **高度な方法:** - 多数のページを処理する場合は、配列化して `for` ループで処理する方法が便利 - カンマ区切りでハンドルを定義し、`split` で配列化して条件判定 **注意点:** `page.handle` は Pages で作成したページにのみ適用される 質問者は提案された解決策で問題を解決できた。
**Author:** ![COLA-KUN](https://avatars.discourse-cdn.com/v4/letter/c/57b2e6/32.png) [@COLA-KUN](https://community.shopify.com/u/COLA-KUN)\ **Post date:** [October 5, 2021, 3:00pm UTC](https://community.shopify.com/t/topic/70060/1 "2021-10-05T15:00:59Z")
はじめまして。 現在テーマDawnでECサイトを作成しています。 デザイン面からTOPページのヘッダーとフッターのみ非表示にしたいのですが上手くいきません。 方法が御座いましたらご教示いただけますと幸いです。 ---
**Author:** ![mrtc](https://yyz1.discourse-cdn.com/shopifyforum/user_avatar/community.shopify.com/mrtc/32/109726_2.png) [@mrtc](https://community.shopify.com/u/mrtc)\ **Post date:** [October 6, 2021, 12:37am UTC](https://community.shopify.com/t/topic/70060/2 "2021-10-06T00:37:44Z")
theme.liquidを開き、{% section ‘header’ %}と{% section ‘footer’ %}の部分を以下のようにしてください。 ```php {% if template != 'index' %} {% section 'header' %} {% endif %} {% if template != 'index' %} {% section 'footer' %} {% endif %} ``` トップページは「index.json」テンプレートを使用するので、テンプレートがindex以外は{% section %}を出力するという分岐をそれぞれに適用させます。 また、{% unless == ‘index’ %}〜{ % endunless %}を使っても同様の処理が可能です。 ---
**Author:** ![COLA-KUN](https://avatars.discourse-cdn.com/v4/letter/c/57b2e6/32.png) [@COLA-KUN](https://community.shopify.com/u/COLA-KUN)\ **Post date:** [October 6, 2021, 12:47am UTC](https://community.shopify.com/t/topic/70060/3 "2021-10-06T00:47:29Z")
ありがとうございます。 完璧にできました！！ ---
**Author:** ![tema\_hira](https://avatars.discourse-cdn.com/v4/letter/t/d2c977/32.png) [@tema\_hira](https://community.shopify.com/u/tema_hira)\ **Post date:** [May 16, 2022, 4:50am UTC](https://community.shopify.com/t/topic/70060/4 "2022-05-16T04:50:14Z")
トップページではなく、特定のページのみ、ヘッダー・フッターを非表示にするにはどうすれば良いでしょうか？ ---
**Author:** ![mrtc](https://yyz1.discourse-cdn.com/shopifyforum/user_avatar/community.shopify.com/mrtc/32/109726_2.png) [@mrtc](https://community.shopify.com/u/mrtc)\ **Post date:** [May 17, 2022, 8:28am UTC](https://community.shopify.com/t/topic/70060/5 "2022-05-17T08:28:58Z")
「特定のページ」というのは、「ドメイン/pages/ハンドル」といったPagesで作成したページのことでしょうか？ 以下のような分岐で非表示にできると思います。 ```php {% if page.handle != 'ハンドル名' %} {% section 'header' %} {% endif %} {% if page.handle != 'ハンドル名' %} {% section 'footer' %} {% endif %} ``` もしくは ```php {% unless page.handle == 'ハンドル名' %} {% section 'header' %} {% endunless %} {% unless page.handle == 'ハンドル名' %} {% section 'footer' %} {% endunless %} ``` ---
**Author:** ![abcde1](https://avatars.discourse-cdn.com/v4/letter/a/7feea3/32.png) [@abcde1](https://community.shopify.com/u/abcde1)\ **Post date:** [October 22, 2023, 5:28am UTC](https://community.shopify.com/t/topic/70060/6 "2023-10-22T05:28:05Z")
とても参考になりました！ こちらの「フッダー・ヘッターの非表示」を複数ページで行う場合はどう記入すればいいんでしょうか？ ---
**Author:** ![mrtc](https://yyz1.discourse-cdn.com/shopifyforum/user_avatar/community.shopify.com/mrtc/32/109726_2.png) [@mrtc](https://community.shopify.com/u/mrtc)\ **Post date:** [October 24, 2023, 12:58am UTC](https://community.shopify.com/t/topic/70060/7 "2023-10-24T00:58:12Z")
「or」を使って複数指定してください。 [https://shopify.dev/docs/api/liquid/basics#operators](https://shopify.dev/docs/api/liquid/basics#operators) ```auto {% if page.handle != 'ハンドル1' or page.handle != 'ハンドル2' %} {% section 'header' %} {% endif %} {% if page.handle != 'ハンドル1' or page.handle != 'ハンドル2' %} {% section 'footer' %} {% endif %} ``` 「page.handle」はPagesで作成したページ以外には適用されないのでご注意ください。 また、該当ページがたくさんあって1行が長くなりすぎてしまう場合や、Pages以外もまとめて処理したい場合は、配列化すると便利かもしれません。 ```auto {%- liquid assign hide_handles = 'ハンドル1,ハンドル2,ハンドル3' | split: ',' assign current_handle = canonical_url | split: '/' | last assign section_hide = false for handle in hide_handles if current_handle == handle assign section_hide = true endif endfor unless section_hide section 'header' endunless unless section_hide section 'footer' endunless -%} ``` 1. 「hide\_handles」に該当ページのハンドルを記述します。 2. 「current\_handle」でカレントページのハンドルを定義します。 3. 「section\_hide」はデフォルト値を「false」に指定します。 4. 「hide\_handles」をforループで処理し「current\_handle」と「handle」が一致した場合に「section\_hide」の値を「true」で返します。 5. unless分岐で「section\_hide」が「true」でない場合に「section」を出力します。 ---
**Author:** ![abcde1](https://avatars.discourse-cdn.com/v4/letter/a/7feea3/32.png) [@abcde1](https://community.shopify.com/u/abcde1)\ **Post date:** [October 26, 2023, 7:52am UTC](https://community.shopify.com/t/topic/70060/8 "2023-10-26T07:52:47Z")
ありがとうございます！！！