Hide the Site Header

Introduction

By default, BuddyBoss does not provide an option to hide the site header. Using a CSS snippet, you can completely remove the header from your site, which is useful for landing pages, custom layouts, or distraction-free content pages.

Custom Workaround

Follow the steps below to hide the site header:

1. Go to BuddyBoss > Theme Options
2. Under Custom Codes, enable CSS
3. Append the following:

.site-header.site-header--bb {

    display: none !important;

}

4. Save changes.

Note: Any modifications are considered as custom work already. Know more about our Support policy here: https://buddyboss.com/support-policy/

Troubleshooting and FAQs

Q: Will this hide the header on all pages?

A: Yes. This CSS hides the header site-wide.

Q: Can I hide the header only on specific pages?

A: Yes. Use the page ID in the CSS selector, for example:

.page-id-123 .site-header.site-header--bb { display: none !important; }

Q: The header is still showing after adding the code. What should I do?

A: Clear your site cache and browser cache. If it still appears, submit a ticket to the support team for assistance.

Q: Will this affect mobile views?

A: No. The snippet works on both desktop and mobile views.

Screenshots

With code