Topic: How to make profile fields display vertically instead of horizontally · BuddyPress.org

Skip to:: Content; Pages; Categories; Search; Top; Bottom

How to make profile fields display vertically instead of horizontally

stephunique
Participant

@stephunique

1 month, 1 week ago

I have WordPress 6.6.2 and Buddypress 14.1.0 and in the edit profile page, the options are displayed horizontally like this: https://snipboard.io/DrOLiw.jpg

This does not look good, they do not even have a gap between them. How can I make them display vertically like a list?

Viewing 2 replies - 1 through 2 (of 2 total)

timdavid01
Participant

@timdavid01

1 month, 1 week ago

You can achieve a vertical display of profile fields in BuddyPress by adding some custom CSS. Try this:

css
#profile-fields .field {
display: block;
margin-bottom: 15px; /* Adjust spacing as needed */
}
Add this code to your theme’s custom CSS section or the Additional CSS section in the WordPress Customizer. This should stack your profile fields vertically with some space between them.

Have you checked if your theme might have any specific settings that affect the layout of BuddyPress fields?

stephunique
Participant

@stephunique

1 month, 1 week ago

I forgot to mention, I am using BuddyX which is the official theme, but it is good to know I can try this if I use another theme.

For some reason it seemed to have resolved itself: maybe because I added the Kirki Customizer Framework or the BP Classic and it took awhile to take effect. In any case, thank you very much.

Viewing 2 replies - 1 through 2 (of 2 total)

You must be logged in to reply to this topic.