public class Employee {
    public string DisplayName { get; set; }
    public string FullName { get; set; }
    public SvgImage Photo { get; set; }
}
//...
Employee emp = new Employee();
emp.DisplayName = "Leah Test Coordinator";
emp.FullName = "Leah Simpson";
SvgImageCollection imageCollection = new SvgImageCollection();
imageCollection.Add("photo", "image://svgimages/icon builder/business_businesswoman.svg");
emp.Photo = imageCollection["photo"];
List list = new List();
list.Add(emp);
htmlContentControl1.DataContext = list;
//...
void OnButtonClick(object sender, DxHtmlElementMouseEventArgs args) {
    if(args.ElementId == "uploadBtn") {
        //...
    }
    if (args.ElementId == "removeBtn") {
        //...
    }
    XtraMessageBox.Show("Button " + args.ElementId + " clicked");
}

Public Class Employee
    Public Property DisplayName() As String
    Public Property FullName() As String
    Public Property Photo() As SvgImage
End Class
'...
Dim emp As Employee = New Employee()
emp.DisplayName = "Leah Test Coordinator"
emp.FullName = "Leah Simpson"
Dim imageCollection As SvgImageCollection = New SvgImageCollection()
imageCollection.Add("photo", "image://svgimages/icon builder/business_businesswoman.svg")
emp.Photo = imageCollection("photo")
Dim list As New List(Of Employee)()
list.Add(emp)
htmlContentControl1.DataContext = list
'...
Private Sub OnButtonClick(ByVal sender As Object, ByVal args As DxHtmlElementMouseEventArgs)
    If args.ElementId = "uploadBtn" Then
        '...
    End If
    If args.ElementId = "removeBtn" Then
        '...
    End If
    XtraMessageBox.Show("Button " & args.ElementId & " clicked")
End Sub

    
    
       
        
        
Upload
        
Remove
    
    

    

        

            

                Display nameVisible to other members
            
            
${DisplayName}
           
        
        

            

                Full nameNot visible to other members
            
            
${FullName}
   
        
    

.container{
    background-color:@Window;
    display:flex;
    flex-direction: column;
    justify-content: space-between;
    border-radius: 20px;
    padding: 0px 30px 16px 30px;
    border-style:solid;
    border-width:1px;
    border-color:@HideSelection;
    color: @ControlText;
}
.avatarContainer{
    display: flex;
    margin-top:16px;
    margin-bottom:16px;   
}
.avatar{
    width: 100px;
    height: 100px;
    border-radius:100px;
    border-style: solid;
    border-width: 1px;
    border-color: @HideSelection;
}
.field-container{
    display:flex;
    flex-direction:column;
    justify-content: space-between;
    flex-grow:1;
    flex-basis: 150px;
    padding-left:10px;
    padding-right:10px;
}
.with-left-margin{
    margin-left:10px;
}
.field-header{
    display:flex;
    justify-content: space-between;
}
.button{
    display: inline-block;
    padding: 10px;
    margin-left: 10px;
    color: gray;
    background-color: @Window;
    border-width: 1px;
    border-style: solid;
    border-color: @HideSelection;
    border-radius: 5px;
    text-align: center;
    align-self:center;
    width: 70px;
}
.hint{
    color: @DisabledText;
    font-size:7.5pt;
}
.button:hover {
    background-color: @DisabledText;
    color: @White;
    border-color: @DisabledControl;
}
.separator{
    width:100%;
    height:1px;
    background-color:@HideSelection;
}

void OnQueryItemTemplate(object sender, QueryItemTemplateEventArgs e) {
    var message = e.Row as DevAV.Chat.Model.Message;
    if(message == null)
        return;
    if(message.IsOwnMessage)
        Styles.MyMessage.Apply(e.Template);
    else
        Styles.Message.Apply(e.Template);
    //...
}

Private Sub OnQueryItemTemplate(ByVal sender As Object, ByVal e As QueryItemTemplateEventArgs)
    Dim message = TryCast(e.Row, DevAV.Chat.Model.Message)
    If message Is Nothing Then Return
    If message.IsOwnMessage Then
        Styles.MyMessage.Apply(e.Template)
    Else
        Styles.Message.Apply(e.Template)
    End If
    '...
End Sub

//CustomizeItem event handler:
void OnCustomizeItem(object sender, CustomizeItemArgs e) {
    //...
    if(message.IsLiked) {
        var btnLike = e.Element.FindElementById("btnLike");
        var btnMore = e.Element.FindElementById("btnMore");
        if(btnLike != null && btnMore != null) {
            btnLike.Hidden = false;
            btnMore.Hidden = true;
        }
    }
    if(message.IsFirstMessageOfBlock)
        return;
    if(!message.IsOwnMessage) {
        var avatar = e.Element.FindElementById("avatar");
        if(avatar != null)
            //Display an empty region instead of the 'avatar' element.
            avatar.Style.SetVisibility(Utils.Html.Internal.CssVisibility.Hidden);
    }
//...
}

Private Sub OnCustomizeItem(ByVal sender As Object, ByVal e As CustomizeItemArgs)
    Dim message = TryCast(e.Row, DevAV.Chat.Model.Message)
    If message Is Nothing Then Return
    If message.IsLiked Then
        Dim btnLike = e.Element.FindElementById("btnLike")
        Dim btnMore = e.Element.FindElementById("btnMore")
        If btnLike IsNot Nothing AndAlso btnMore IsNot Nothing Then
            btnLike.Hidden = False
            btnMore.Hidden = True
        End If
    End If

    If message.IsFirstMessageOfBlock Then Return
    If Not message.IsOwnMessage Then
        Dim avatar = e.Element.FindElementById("avatar")
        'Display an empty region instead of the 'avatar' element.
        If avatar IsNot Nothing Then avatar.Style.SetVisibility(Utils.Html.Internal.CssVisibility.Hidden)
    End If
    '...
End Sub

${UserName}

$Welcome {UserName}!