Forum Discussion

Lindsey's avatar
Lindsey
Leader
5 years ago

Way to distinguish "sender" vs "receiver" in threaded private messages (version 3.1)

In the threaded view of private messages, is there any way to distinguish by class or id which message is what the user sent, and which is the one being received? We are attempting to style the conversation in a "text message bubble" type styling, however this seems to be impossible since there is no way to make this distinction by class or id for which message is being sent or received. 

  • peterlu's avatar
    peterlu
    5 years ago

    Lindsey You are correct. There are no class or id for css style. But maybe you can use custom JS to check which threaded message belongs to the current user, since every message has a username. The custom JS can then add some additional className to the message for your css to pickup and style.

4 Replies

Sort By
  • peterlu's avatar
    peterlu
    Champion
    5 years ago

    Lindsey You are correct. There are no class or id for css style. But maybe you can use custom JS to check which threaded message belongs to the current user, since every message has a username. The custom JS can then add some additional className to the message for your css to pickup and style.

  • Lindsey's avatar
    Lindsey
    Leader
    5 years ago

    peterlu that is true, the only thing is if we use JS to do this it might flash from original to our custom styling for a second 😕 Maybe I will make this into a Khoros Idea post for them to add this class distinction.

  • peterlu's avatar
    peterlu
    Champion
    5 years ago

    Lindsey the flashing problem can be solved by a technique. 

    1. Use CSS to hide the messages block.

    2. Apply custom JS to run and add classes

    3. When custom JS is finished running, then use JS to unhide the messages block.

    This way you won't see a flashing experience from original to custom.