# Display HTML in the Grid

## Environment

<table>
    <tbody>
	    <tr>
	    	<td>Product Version</td>
	    	<td>2.4.2</td>
	    </tr>
	    <tr>
	    	<td>Product</td>
	    	<td>Progress® Kendo UI for Vue</td>
	    </tr>
    </tbody>
</table>

## Description

How can I render HTML inside the Kendo UI for Vue Grid?

## Solution

Define a custom template for the Grid column that must display rendered HTML. Pass the custom template to the selected column using the cell [`cell`](https://www.telerik.com/kendo-vue-ui-develop/components/grid/api/gridcolumnprops#cell) column property. Define the custom template as follows:

```js
<template #myTemplate="{props, listeners}">
    <td :class="props.className" v-html="getNestedValue(props.field, props.dataItem)"></td>
</template>
```

Add apply the template to the selected column with the following definition:

```js
{ field: 'ProductName', title: 'Product Name', cell: 'myTemplate' }
```

[Demo Source](https://demos.telerik.com/kendo-vue-ui/knowledge-base/render-html-in-native-grid/source.txt)