Thanha, you just do the next steps 

1. select widget tree view 

2. select your target header

3. Drag the icon into it 

Hi. You can achieve this in two different ways: CSS or Javascript.

CSS: 

First, to completly remove the title, in Service Studio, type a space char in the GridHeader placeholder.

It looks like the grid component needs some character here or it will fall back to its default value.

Then add the CSS below to your theme.

The first part will prepare the space after the column title to display a FontAwesome icon. The second part will place the icon there using its code. You can use the :nth-child(n) to choose in what header to place the icon.

.wj-colheaders .wj-row .wj-cell.wj-header > div::after {    
	width: 1.28571429em;
	text-align: center;
	display: inline-block;
	font: normal normal normal 14px/1 FontAwesome;
	font-size: inherit;
	text-rendering: auto;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	transform: translate(0, 0);
}

.wj-colheaders .wj-row .wj-cell.wj-header:nth-child(1) > div::after {
	content: "\f037";
}
	

Result:

Javascript

To use javascript we need to create a DataGrid custom cell render.

Paste the javascript code below  in the JavaScript property of the page(or where you see more fit)

headerIconRenderer = function (s, e) {
    // Only for ColumnHeader, exclude cells
    if (!e.panel || e.panel.cellType !== wijmo.grid.CellType.ColumnHeader)
        return;
        
    if (e.panel == s.columnHeaders) {
        if (e.getColumn().header === 'Part No.') {
            e.cell.innerText = '';
            e.cell.innerHTML = '<span class="fa fa-fw fa-tag"></span>'
        }
    }
}
	

This will check for a specific header, erase the column title and add the icon.

Next, go to the Grid AvancedFormat property and add the line below

"validateEdits: false,
 headersVisibility: wijmo.grid.HeadersVisibility.All,
 selectionMode: wijmo.grid.SelectionMode.CellRange,
 formatItem: headerIconRenderer
"

Result:

And that's it!

I hope it helps"