Make Header invisible on individual pages?

You can hide the header on that specific page by adding this to your child theme:

.page-id-89 .site-branding {
    display: none;
}

To hide it on multiple pages, just add the page IDs in question. For example, let’s say you wanted to hide the header on page ID 89, 95, and 102, the syntax would be:

.page-id-89 .site-branding, .page-id-95 .site-branding, .page-id-102 .site-branding {
    display: none;
}

Let me know how it goes.

Thanks Kathryn, that works a treat.

If there are only a couple of pages where you need hide the header, that answer is suitable. However if the no-header option is going to be more common your best bet is to create a page template.

thanks nood, i’ll have a go at that as well

Sure, if you want to hide the header on all pages and posts, this will do the trick:

.site-branding {
    display: none;
}

I don’t think a custom template is needed when a bit of CSS will work just fine. ??

Since you mentioned “selected pages only” it sounded like the change was page-specific, so that’s why I gave the page-specific CSS above. ??

@nood, I did look at making a page template, but don’t have the time to follow up on that.
Kathryn’s fix works fine though.