Conditionally display a tab

Beaver Builder
1

Hi,

I have the latest ver of BB installed. On my profile page I have 3 tabs… using the tab component in advanced modules.

tab1 = WP user profile
tab2 = newsletter status
tab3 = church profile form (formidable forms)

Is it possible to display tab3 only for if a user role = churchadmin (custom role)?

Didn’t find anything in the forum…

Thanks
Mel

2

Hey Mel,

I think an easier way around this would be for you to use a membership plugin, and restrict the content on the 3rd tab. With BB, I think we can hide it with CSS but that can easily be worked around. Using a membership plugin won’t necessarily remove the 3rd tab, but at least the content will only be visible by the said custom role. There should be a lot of free membership plugins out there. Give it a shot and let us know if it works for you! :slight_smile:

Ben

3

Hi,

yes I am looking at membership plugins and found a plugin called “Ultimate member profile tabs” that might work.

If I wanted to use CSS how would I do hide a tab based on user role?

Thanks…
Mel

4

Hey Mel,

We can add an extra class to the body tag where it reflects the role. We can also do the same to the Tabs module. Once that is done, we can then target the 3rd tab of that specific module when that specific role is logged in. The code below adds the class to the body tag. This goes to your child theme’s function.php file.

function add_role_to_body($classes) {
  $current_user = new WP_User(get_current_user_id());
  $user_role = array_shift($current_user->roles);
  if (is_admin()) {
    $classes .= 'role-'. $user_role;
  } else {
    $classes[] = 'role-'. $user_role;
  }
  return $classes;
}
if ( is_user_logged_in() ) {
  add_filter('body_class','add_role_to_body');
  add_filter('admin_body_class','add_role_to_body');
}

You can add an extra class to the module under the Advanced module. Say for example, if the class you added is fl-tabs-restrict-content, the CSS code below will hide the 3rd tab.

.role-churchadmin .fl-tabs-restrict-content .fl-tabs-label:nth-child(3), 
.role-churchadmin .fl-tabs-restrict-content .fl-tabs-panel:nth-child(3) {
    display: none;
}

Ben

5

Hi Ben,

Thanks for the fast response… I will check this out and think how I want to implement this.
I appreciate the code example and hope it also will help someone else.

Thank You
Mel

note ** closed topic

6

No worries at all! Just pointing out again that the CSS method is pretty easy to bypass. If you’re trying to hide sensitive information, I’d suggest using the memberships plugin. :slight_smile:

I’ll be marking this as resolved now. Enjoy! :slight_smile:

Ben