Shape the future of Social networking with WordPress: Join Project Midnight Sun! The next generation platform for community building with WordPress!

BuddyDev

Search

Buddypress User Badges and bbpress

  • Participant
    Level: Initiated
    Posts: 1
    Erotopia on #56051

    Hello πŸ™‚

    We are using the BuddyPress User Badges plugin on our community site, and we are very happy with it so far. We really believe it can be a strong motivational feature for our users.

    However, we have encountered a layout issue in bbPress when a user has more than four badges. The badges start to overlap or appear underneath the post text instead of staying neatly aligned.

    We were wondering if this is something that can be adjusted or fixed β€” for example, allowing the badges to wrap onto multiple rows in bbPress views?

    Our intention is that users should be able to earn several badges for different achievements over time, so it’s very likely that some users will end up with four or more badges.

    I can send a screenshot showing the issue if needed.

    Thank you very much in advance for your help, and for your great work on this plugin.

  • Keymaster
    (BuddyDev Team)
    Posts: 25294
    Brajesh Singh on #56055

    Hi,
    Welcome to BuddyDev support forums.

    Thank you for purchasing from us. I am glad our plugins are useful for your purpose.

    I am sorry for the inconvenience, It is probably the css we are using causing it.

    Please link me to a screenshot showing the issue and let me know which theme are you using. I will assist promptly.

    Regards
    Brajesh

  • Participant
    Level: Initiated
    Posts: 1
  • Keymaster
    (BuddyDev Team)
    Posts: 25294
    Brajesh Singh on #56058

    Thank you. There is a simple solution. We can add the following css to fix it.

    
    .bp-user-badges-badge-list {
    
     flex-flow: row wrap;
    }
    

    You can add it in your additional css option for the theme.

    If you are using FSE theme, you can do it from Appearance->Editor->Styles, look for the triple dot icon on the style panel’t top right and click on it. It will show you the option to add additional css. Here is a link showing it.

    https://i.ibb.co/rRXk6YZn/Selection-442.png

    Please let me know if it works for you or not?

    Regards
    Brajesh

    • This reply was modified 9 hours, 18 minutes ago by Brajesh Singh.

You must be logged in to reply to this topic.

This topic is: not resolved