---
title: "Excel Export - Hyperlinks"
enterprise: true
framework: javascript
version: "36.1.0"
---

# Excel Export - Hyperlinks

This section describes how to insert hyperlinks in the cells of the exported Excel file.

## Exporting Formulas

You can insert `hyperlinks` in the cells of the exported Excel file by outputting an Excel formula containing a [Hyperlink function](https://support.microsoft.com/en-us/office/hyperlink-function-333c7ce6-c5ae-4164-9c47-7de9b76f577f) with a URL value you provide. The code below inserts hyperlinks in the Excel export file for all values in the URL column.

```js
const gridOptions = {
    columnDefs: [
        { field: 'company' },
        {
            field: 'url',
            cellClass: 'hyperlinks' // references excel style
        }
    ],
    defaultExcelExportParams: {
        autoConvertFormulas: true,
        processCellCallback: params => {
            const field = params.column.getColDef().field;
            return field === 'url' ? `=HYPERLINK("${params.value}")` : params.value;
        }
    },
    excelStyles: [
        {
            id: 'hyperlinks',
            font: {
                underline: 'Single',
                color: '#358ccb'
            }
        }
    ],

    // other grid options ...
}
```

Note the following:

- The URL column of the grid below has URL values.
- In the exported Excel file, the URL column has active links for these URL values.

#### Excel Export - Hyperlinks

```ts
import {
  CellStyleModule,
  ClientSideRowModelModule,
  GridApi,
  GridOptions,
  ModuleRegistry,
  createGrid,
  enableDevValidations,
} from "ag-grid-community";
import {
  ColumnMenuModule,
  ContextMenuModule,
  ExcelExportModule,
} from "ag-grid-enterprise";

// Enable extended validations only for development
if (process.env.NODE_ENV !== "production") {
  enableDevValidations();
}

ModuleRegistry.registerModules([
  CellStyleModule,
  ClientSideRowModelModule,
  ExcelExportModule,
  ColumnMenuModule,
  ContextMenuModule,
]);

let gridApi: GridApi;

const gridOptions: GridOptions = {
  columnDefs: [{ field: "company" }, { field: "url", cellClass: "hyperlinks" }],
  defaultColDef: {
    flex: 1,
    minWidth: 100,
  },
  defaultExcelExportParams: {
    autoConvertFormulas: true,
    processCellCallback: (params) => {
      const field = params.column.getColDef().field;
      return field === "url" ? `=HYPERLINK("${params.value}")` : params.value;
    },
  },
  excelStyles: [
    {
      id: "hyperlinks",
      font: {
        underline: "Single",
        color: "#358ccb",
      },
    },
  ],

  rowData: [
    { company: "Google", url: "https://www.google.com" },
    { company: "Adobe", url: "https://www.adobe.com" },
    { company: "The New York Times", url: "https://www.nytimes.com" },
    { company: "Twitter", url: "https://www.twitter.com" },
    { company: "StackOverflow", url: "https://stackoverflow.com/" },
    { company: "Reddit", url: "https://www.reddit.com" },
    { company: "GitHub", url: "https://www.github.com" },
    { company: "Microsoft", url: "https://www.microsoft.com" },
    { company: "Gizmodo", url: "https://www.gizmodo.com" },
    { company: "LinkedIN", url: "https://www.linkedin.com" },
  ],
};

function onBtExport() {
  gridApi!.exportDataAsExcel();
}

const gridDiv = document.querySelector<HTMLElement>("#myGrid")!;
gridApi = createGrid(gridDiv, gridOptions);

if (typeof window !== "undefined") {
  // Attach external event handlers to window so they can be called from index.html
  (<any>window).onBtExport = onBtExport;
}
```

[Live example: Excel Export - Hyperlinks](https://www.ag-grid.com/examples/excel-export-hyperlinks/excel-export-hyperlinks/typescript)
