WordPressテーマSANGOの質問

特定の固定ページのみ、ヘッダーやグローバルメニューを非表示にしたい

アバター
のりこ

お世話になります。
表題のとおり「特定の固定ページのみ、ヘッダーやグローバルメニューを非表示にしたい」です。

LPとして使うため、アイキャッチ画像や本文から始まる状態を希望しています。

既出コメントには「前頁ヘッダー非表示の方法」はありましたが、他の投稿ページは消したくないです。

お忙しいところ恐縮ですが、よろしくお願いいたします。

SANGO
SANGO 質問ガイドライン
コメントへの回答
サルワカくん
サルワカくん
2020/03/12

お世話になっております。
まず、ヘッダーを非表示にするCSSは、以下のようになります。

.header {
    display: none;
}

特定の投稿ページや固定ページでのみこのCSSを適用したい場合、上記CSSを含むstyleタグをそのページの本文内に追加してしまえばOKです。
ブロックエディター(Gutenberg)を使用している場合、エディターの一番上にカスタムHTMLブロックを挿入して、その中に次のコードを書きます。

<style>.header {
    display: none;
}</style>

旧エディター(クラシックエディター)を利用している場合、「テキスト」エディターの方に上記のコードを貼り付ければ良いかと思います。

よろしくお願いします。

アバター
のりこ
2020/03/12

ありがとうございます!
クラシックエディタの方でやったら、できました!!
この数日悩んでいたのに、あっさりできてすごく感激しています。
素早いお返事で助かりました。ありがとうございました!

アバター
のりこ
2020/03/13

何度も本当に申し訳ありません。

「固定ページヘッダー非表示」の件について、
昨日教えていただいたコードを入力後一度はヘッダー非表示になりますが、すぐに(10秒ほどすると)ヘッダーが表示されてしまいます。

何度やっても表示されるので、よく見てみると勝手にコードが変わってしまうようなのです。

このように、です↓
.header {
display: none;
}

コードが変わらない方法はありますか?

お忙しいところ何度も申し訳ないのですが、教えていただけると嬉しいです。
よろしくお願いいたします。

サルワカくん
サルワカくん
2020/03/13

実際にサイトを見てみないと原因が分からないのですが、別の方法があるので紹介します。

以下のCSSをダッシュボードの[外観]⇒[カスタマイズ]⇒[追加CSS]に貼り付けることで、指定したIDの固定ページでヘッダーが非表示になります。

.page-id-投稿ID .header {
    display: none;
}

例えば

.page-id-365 .header {
    display: none;
}

のような形ですね。

ヘッダーを非表示にしたい固定ページが複数ある場合は、

.page-id-12 .header,
.page-id-34 .header {
    display: none;
}

のようにします。

なお、<style>タグは不要です。また、投稿ページで同じことをする場合、.page-id-12ではなく.postid-12のように書く必要があります。

よろしくお願いします。

アバター
のりこ
2020/03/13

できました!!!
度々の質問に丁寧に回答してくださり、本当に本当にありがとうございました!

サルワカくん
サルワカくん
2020/03/13

いえいえ!ご報告ありがとうございました。