Introduction
By default, BuddyBoss displays the BuddyPanel on all pages, and there’s no built-in option to selectively hide it. You can hide the BuddyPanel on specific pages using a custom CSS snippet. This is useful if you want a cleaner layout on landing pages, registration pages, or any page where the BuddyPanel isn’t needed.
Custom Workaround
Follow the steps below to hide the BuddyPanel on specific pages:
- Go to BuddyBoss > Theme Options
- Under Custom Codes, enable CSS
- Append the following code (replace page-id-4798 with your target page ID):
.page-id-4798 .buddypanel { display: none; }
.page-id-4798.bb-buddypanel:not(.register) .site,
.page-id-4798.bb-buddypanel:not(.activate) .site { margin: 0; }
.page-id-4798.bb-buddypanel.sticky-header:not(.bb-sfwd-aside) .site-header { width: 100%; }- Save changes
Troubleshooting and FAQs
Q: Will this hide the BuddyPanel on all pages?
A: No. This snippet only hides the BuddyPanel on pages with the specific page ID you target.
Q: Can I hide the BuddyPanel on multiple pages at once?
A: Yes. You can duplicate the CSS line for each page ID. Example:
.page-id-4798 .buddypanel, .page-id-123 .buddypanel { display: none; }Q: The BuddyPanel is still visible, what should I do?
A: Clear your site and browser cache. Ensure the correct page ID is used. If the code is not working, submit a ticket to the support team for assistance.
Q: Will this affect the layout of the page?
A: The additional CSS in the snippet adjusts margins and header width to prevent layout issues.
How to find your page ID
1. On your WordPress dashboard, click on Pages > All Pages
2. Select the page that you need to find the ID for. For this instance, I have chosen About page.
3. Once the page is opened, you need to look at the URL in your web browser’s address bar. Here, you will find the page ID number displayed within the page URL.
