The BuddyPress Profile Tabs Pro plugin adds a wrapper div to the content to allow you easily style it.

We add following css classes to the div. You can use the generic or the specific classes to target contents for every tab generated by Profile Tab Pro or just a few.

Assumptions:-

For this tutorial, we have following assumptions:-

• We have a tab name “Support” with slug “support”
• We have a sub tab of the Support tab name “help”
• We are going to style the contents of this help sub tab.

In this example, our tab slug is “support”, sub tab slug is “help”.

The following markup is generated for this content

As you can see, we add some generic classes as shown below:-

• bbptc-item-content
• bbptc-member-content

And some specific css classes like

• bpptc-content-tab-support
• bbptc-content-sub-tab-help
• bpptc-content-view-support-help

In your case, the specific class will depend on the slug of your tab/sub tab.

Here is an example css code we can use to style all tabs generated by BuddyPress User Profile Tabs Pro

 

You can visit Dashboard->Appearance->Customize and click on “Additional CSS” and add the code.