BuddyDev

Search

EDIT MEMBER TYPE AVATARS – DIFFERENT FOR EACH MEMBER TYPE (not default avatar)

Tagged: , , ,

  • Participant
    Level: Initiated
    Posts: 19
    adam gibbs on October 14, 2020 at 11:55 am #33916

    Hi Guys,

    I’m trying to differentiate member types by adapting their avatars so they are easily recognisable in members directories etc. I thought of applying some light css to their avatars and thought I would start simple with a different coloured border for each different member type however what I have tried isn’t working, I can only achieve a different boder for user number.

    Please see below, I appreciate any suggestions. Thanks

    A

    This works for users but would take some time to do all users this way.

    img.avatar.user-1-avatar {
 
border: 3px solid #FF0000;

}

    One of my attempts for member type was this…

    img.avatar.bp-member-type-dj-avatar {
border-radius: 25%; 
border: 3px solid #FF0000;

}
  • Keymaster
    (BuddyDev Team)
    Posts: 24190
    Brajesh Singh on October 14, 2020 at 5:19 pm #33926

    Hi Adam,
    You can target avatar based on the item list entry class instead of the avatar. The item list contains member type and you can use that as a parent select to scope/select avatars.

    Regards
    Brajesh

    PS:- A polite reminder, Please avoid using all caps in the topic title in future. It creates bad experience for our forums and we appreciate not using it.

  • Participant
    Level: Initiated
    Posts: 19
    adam gibbs on October 14, 2020 at 5:30 pm #33931

    Hi Brajesh,

    Thanks for your reply and info, I shall give it a shot.

    Re the all caps, sorry I didn’t realise, false of habit – wasn’t trying to come across as brash or shouty.

    Regards,

    A

  • Keymaster
    (BuddyDev Team)
    Posts: 24190
    Brajesh Singh on October 14, 2020 at 5:33 pm #33933

    Hi Adam,
    No issues.

    Please give that a try and let me know if it works or not?

    Regards
    Brajesh

You must be logged in to reply to this topic.

This topic is: not resolved