BBPress / Forums and BuddyForms buttons do not match theme

[hopecenter]

Hi, none of my BuddyPress form buttons match my sites theme, I have a custom CSS box in my theme. Can you give me some CSS coding that will fix my problem?

1. BBPress and BuddyForms BUTTONS do not matching my sites theme (size, colour, shape, nothing)

2. BB Forums page doesn’t display correctly. There are small round circles like bullets from an unordered list all over the page. It doesn’t match my site theme.

3. reCaptcha not displaying properly or at all on the login, form, or registration pages.

[Sven Lehnert]

Hi @hopecenter,

I was not able to recreate this issue. I have the feeling this is a theme issue and has noting to do with BuddyPress or BB-Press.

Please share a link with the different buttons. This will make it possible that someone help you with a css fix.

Cheers,
Sven

[hopecenter]

Hi Sven,

Thanks for responding to my post. Sorry, I didn’t know we could post links to our website here. :O Here are the links to the pages that are giving me problems. I’d really appreciate it if you were able to help me. Thank you.

Here is the BB Forum
https://www.thehopecntr.com/groups/

The BuddyForm is a the bottom of the page:
https://www.thehopecntr.com/events/

Business Directory Plugin buttons:
https://www.thehopecntr.com/directory/

Ask Us Form buttons
https://www.thehopecntr.com/ask-us/

[hopecenter]

oops, I forgot the login in page:

https://www.thehopecntr.com/login

Thanks again. ??

[ThemeSumo]

Add this to your Child Theme style.css file, or by using a Custom CSS plugin.

.wpbdp-main-links input,
.box-col.submit-btn input,
.listing-actions a.button.view-listing {
    padding: 10px;
    border: 0;
    background: #3FB0AC;
    color: #fff;
}

As for the Submit button, you could try this aswell:

#add-an-event.bf-submit.btn.btn-primary {
	background: #3FB0AC !important	
}

Hope this helps.

[hopecenter]

Hi @themesumo,

Thank you for your response and the CSS code. I tried the code in my Custom CSS area, thanks it worked on my Events page. However it did fix the other pages that I listed.

So does that mean that I should only leave the CSS for the Submit button in the Custom CSS area?

#add-an-event.bf-submit.btn.btn-primary {
background: #3FB0AC !important
}

and remove the other part? Or are both needed for it to work?

Looking forward to your response. ??

[ThemeSumo]

Try something like this instead:

.wpbdp-main-links input,
.box-col.submit-btn input,
.listing-actions a.button.view-listing,
#bbp_search_submit,
#add-an-event.bf-submit.btn.btn-primary,
#submit {
    padding: 10px;
    border: 0;
    background: #3FB0AC;
    color: #fff;
}
#bbp_search { 
    margin-top: 7px;
    padding: 10px;
}
.wpbdp-main-links input, 
.box-col.submit-btn input, 
.listing-actions a.button.view-listing, 
#tribe-events .tribe-events-button, 
.tribe-events-button, #tribe-events 
.tribe-events-button:hover, 
.tribe-events-button.tribe-active:hover, 
.tribe-events-button.tribe-inactive, 
.tribe-events-button:hover {
    padding: 10px !important;
    border: 0 !important;
    background: #3FB0AC !important;
    color: #fff !important;
    border-radius: 0 !important;
}

[hopecenter]

Oh my gosh @themesumo, I could cry, I am so happy! Thank you so much for helping me. ?? Things are looking soooo much better now. The Ask Us page button is just perfect, thank you.

The Events page buttons is good too, the theme buttons are supposed to be a regular rectangle shape (no rounded corners) but it’s close enough.

The Forum Topics page SUBMIT button did NOT change. ??
https://www.thehopecntr.com/forums/forum/homeschool/

The Buddy Forms, BuddyPress and Ultimate Members buttons didn’t change, I am guessing you couldn’t see those because they are in the members area. But I am having the same issue with those buttons too.

Most of the Directory buttons changed and are perfect too. The EDIT and DELETE buttons on that page have not changed though.

The Community Groups (Forum) Search button is perfect, but the little circle bullet looking things that are in front of every item are not supposed to be there, if you could fix that that would be wonderful.

What you have done is really great, I was so frustrated with the plugins not working properly. Now thanks to you, I am that much closer to launching the new site. I am so excited!

Have a great day.

[ThemeSumo]

For the events page you can add this:

#add-an-event.bf-submit.btn.btn-primary {
    border-radius: 0;
    text-shadow: none;
}

You should also add this to the large block of code I gave you earlier:

cursor: pointer;

Just insert it in three locations, before each closing curly bracket }. It will make the mouse cursor turn to a hand pointer to denote the element is clickable, right now, some buttons appear as though they’re not clickable.

The Buddy Forms, BuddyPress and Ultimate Members buttons didn’t change, I am guessing you couldn’t see those because they are in the members area. But I am having the same issue with those buttons too.

Correct, you can use your browsers Inspect Element feature, or use a tool like Firebug, to inspect your code structure and locate the classes you need to use to customize certain elements.

The Community Groups (Forum) Search button is perfect, but the little circle bullet looking things that are in front of every item are not supposed to be there, if you could fix that that would be wonderful.

Those bullet styles are unrelated to my code, they’re controlled by other code such as:

#main-col .elements-box ul li, 
#main-col .post ul li {
  padding-left: 0px;
  list-style: square inside none;
}

Hope this helps.

• This reply was modified 8 years, 4 months ago by ThemeSumo. Reason: clarity

[hopecenter]

Hi @themesumo, I tried what you gave me but sadly, it didn’t work. The only thing that changed was the pointer. Thank you for that helpful tidbit, it will definitely help users figure out what’s clickable.

About the inspect element and FireBug thing, I am able to open the inspect element window but I can’t understand ANYTHING I see there. I am by no means qualified to do anything except for fiddling around with a WordPress blog and installing plugins. I am just another stay-at-home mom with a blog. ??

Thanks so much for all of your help.