Buddypress Login / Register Widgets (pages)

Whew - we’re getting through our first X Buddypress install, with only a few tears :wink:

A few questions have left me stumped - if you can assist that would be amazing.

  1. I managed to add a login widget to a side bar and then add the widget element to a page to have the login displayed on a page (instead of the wordpress login page) but the css I added to edit the color of the text changed all the widget text across the site - is there a way to edit only one widget and not the others?

  2. on the above form I also hid the register button (it was so small it was to hard to see). Could I use the button element to place a Register button below and then link to #3’s potential page?

  3. Is there a method similar to the above where we can create a page and insert the standard Buddypress Register form directly into a cornerstone page?

Hi @DeeDesign,

I managed to add a login widget to a side bar and then add the widget element to a page to have the login displayed on a page (instead of the wordpress login page) but the css I added to edit the color of the text changed all the widget text across the site - is there a way to edit only one widget and not the others?

To change the text color, you can add this in Theme Options > CSS

.buddypress.widget a {
   color:red;
}

on the above form I also hid the register button (it was so small it was to hard to see). Could I use the button element to place a Register button below and then link to #3’s potential page?

We can add a little css to make the register button big. Can you please put it back.

Is there a method similar to the above where we can create a page and insert the standard Buddypress Register form directly into a cornerstone page?

Regretfully this is can only be possible with custom development but this is outside the scope of support that we offer.

To give you an idea, you may check the link below

Thanks

Thank you Paul,

I have added the below css to adjust both the text and link colours of the login widget on the page.

.buddypress.widget{
	color: #fff !important;
}

.buddypress.widget a{
	color: #fff !important;
}

but that changes all the side bar widgets across the site. Is there a way to target only this widget on this page with the font color updates?

Register link is back - is there a shortcode to turn it into a X button?

Many thanks.

Hello @DeeDesign,

There are two ways you can style the widget just only for this page. The most and easiest way is to use the page ID in your custom css like this:

.page-id-100000684 .buddypress.widget,
.page-id-100000684 .buddypress.widget .h-widget{
	color: #fff !important;
}

.page-id-100000684 .buddypress.widget a{
	color: #fff !important;
}

To know how you can get the page ID, please check this out:

Or you can edit the page and insert members-page as a custom body class for the page:

And then have your custom css updated with this:

.members-page .buddypress.widget,
.members-page .buddypress.widget .h-widget{
	color: #fff !important;
}

.members-page .buddypress.widget a{
	color: #fff !important;
}

We would love to know if this has worked for you. Thank you.

AmAzInG! Thank you for your patience and for helping me understand how to define that one widget.
I learned so much from this, both about css and addressing one page within X.
I hope this helps others also.

Next up my mission to have get the Buddypress register form working in Cornerstone.
Dreaming of a Buddypress set of Cornerstone elements :crystal_ball:

Many thanks RueNel!

On behalf of my colleague, you’re welcome. Cheers! :slight_smile:

:pray: Many thanks!

You’re welcome! :slight_smile:

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.