member cards

[monsurc1]

Hi

Is it possible to have the member info cards on members page have all same height / size in buddyapp?

attachment added here for clarity of the question.

Thanks

Attachments:

You must be logged in to view attached files.

[Kieran_SQ]

Hi,

Thanks for contacting us about the members directory layout. It is possible, but not advised, to force the height of these elements. By forcing the height you’ll be breaking the styles that govern the internal elements of each card – for example whether a user will have a background image on their profile card or not. If they do not, this won’t look great.

However, the CSS to achieve this is below, please use in your BuddyApp Child theme’s style.css or in Appearance > Theme Options > Scroll to: ‘Quick CSS’

COPY CODE

#buddypress ul.item-list li .item-wrap {
    height: 400px !important;
    margin-bottom: 20px !important;
}

Please change the 400px value to suit your needs and increase or decrease the 20px for your desired space between each card. Please clear your website cache, CDN and local cache (Ctrl+F5) to see any changes.

Thanks,

Kieran.

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

If you like the theme or the support you've received please consider leaving us a review on Themeforest!

Custom development requests can be sent to dev@seventhqueen.com, one of the development team will be happy to discuss your needs.

[monsurc1]

Hi Kieran.

you are right. Is it possible to restrict the message (activity update) to a max-height in the card? Or, totally not display the message , except the “view” button. I tried it via CSS, but could not do it.

Thank You.

[Kieran_SQ]

Hi,

You can use the below CSS to set a max height for the updates within the members directory, adjust the 50px value to suit your needs – and as always, clear all caches / CDN to see any changes.

COPY CODE

#buddypress ul.item-list#members-list li .item .update {
    max-height: 50px !important;
    overflow: hidden;
    text-overflow: ellipsis;
}

You can use the below CSS to hide the element altogether if you so wish

COPY CODE

#buddypress ul.item-list#members-list li .item .update {
    display: none !important;
}

All the best,

Kieran.

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

If you like the theme or the support you've received please consider leaving us a review on Themeforest!

Custom development requests can be sent to dev@seventhqueen.com, one of the development team will be happy to discuss your needs.

[Author]

Posts