WordPress – How to Manage BuddyPress Settings on the Frontend

Hi there. This tutorial is part of a series where you’ll learn how to build a beautiful frontend dashboard for BuddyPress.

You can use this frontend dashboard to create a platform where users will be able to create and manage community sites with WordPress. Basically, users will be able to manage a social media site from a beautiful frontend dashboard that is based on BuddyPress; they won’t have to use the normal WordPress dashboard.

For this, you need to use two plugins:

1. BuddyPress – This plugin provides all the community settings for WordPress. Users can create an account on your site to connect with each other, post updates, view others’ activity and posts, change their profile pic, etc.
2. WP Frontend Admin – With this plugin, you can display any wp-admin page on the frontend. In this case, it’ll be useful to display all the BuddyPress admin pages on the frontend. You can integrate this plugin with WordPress Multisite and WP Ultimo to create a multisite platform where users will use the frontend dashboard to manage their sites.

Once you install and activate these two plugins, you need to follow these simple steps to display the BuddyPress settings on the frontend:

1- Show the BuddyPress settings on the frontend

WP Frontend Admin allows you to display any wp-admin page on the frontend in at least two ways: you can do it with one click, or you can do it using a simple shortcode.

To display the BuddyPress settings on the frontend with one click, you need to:

1. Go to Settings > BuddyPress in wp-admin
2. Hit View on the frontend on the top admin bar.

WP Frontend Admin allows you to build frontend pages for your BuddyPress dashboard using any WordPress page builder. Here are some examples of page builders:

• Elementor
• Visual Composer
• Gutenberg
• Divi
• Beaver Builder
• WP Page Builder
• Page Builder by SiteOrigin
• Oxygen
• Live Composer
• Brizy
• Etc.

You need to use this shortcode to display the BuddyPress settings on the frontend:

[vg_display_admin_page page_url="options-general.php?page=bp-components"]

Now just hit Preview because WP Frontend Admin only shows admin content in Preview or Live mode, not in edit mode.

2- Select the basic info on your BuddyPress settings page

WP Frontend Admin will display the BuddyPress settings on the frontend, and you’ll see the Quick Settings panel on the left side of the screen. You can use this panel to configure your frontend pages.

Start by selecting the following information:

• Page title: We’ll call it “Settings”.
• URL slug: We’ll enter something like “settings”.
• Page template: You can select the default template to use your theme’s appearance. If you’re using any page builder, select the best option for you.
• Add to this menu: You can add this page to a navigation menu by selecting it here.

3- Hide any unnecessary elements from your frontend settings page

WP Frontend Admin allows you to hide any unnecessary elements from your frontend pages.

For example, you can hide the settings selector and the Credits tab from the frontend settings page.

1. Hit Hide element.
2. Click the element you want to hide.
3. Repeat these two steps.

You can also tick the Hide notices added by other plugins or themes checkbox to prevent users from viewing admin notices on this frontend page.

4- Edit any texts on your frontend BuddyPress settings page

Besides hiding any unnecessary elements, you can edit any texts on your frontend pages. In this case, there aren’t many texts that could be changed; however, you can edit any texts to rename fields, tabs, etc.

1. Hit Edit texts.
2. Change any texts you want.
3. Hit Stop editing texts.

5- Allow any user role to view the frontend BuddyPress settings page

Take into account that only the users with the bp_moderate capability will be able to view and manage the BuddyPress settings on the frontend. You can follow this tutorial to learn how to add that capability to any user role using the User Role Editor plugin.

Once your page has been published and added to the frontend BuddyPress dashboard, this is what it could looke like:

Remember that page design depends on your creativity. Definitely, displaying the BuddyPress settings on the frontend and allowing any user role to manage them in the frontend is easy with WP Frontend Admin.