> For the complete documentation index, see [llms.txt](https://docs.klai.studio/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.klai.studio/engineering-reference-docs/betterforms-error-pages-api/custom-error-handlers.md).

# Custom error handlers

Besides customizing the error page, you can also customize how all errors are handled and override the default system behavior.

For example, the default <mark style="color:red;">`‘Page Not Found’`</mark> error would navigate to the <mark style="color:red;">`/error`</mark> page but if you would rather show a toaster alert, the following could be added to the <mark style="color:red;">`App`</mark> model.

```json
{
	"errorHandlers": [{
        "actions": [{
            "action": "showAlert",
            "function": "action.options.text = action.options.error.message",
            "options": {
                "text": "",
                "title": "Error",
                "type": "error"
            }
        }],
        "codes": ["404"]
    }]
}
```

As it can be seen above, custom behaviours are added under a reserved global actions key <mark style="color:red;">`errorHandlers`</mark>, and that will be an array of objects. Each object having have <mark style="color:red;">`codes`</mark> and <mark style="color:red;">`actions`</mark>.

| Key     | Value                                                                                             |
| ------- | ------------------------------------------------------------------------------------------------- |
| codes   | <mark style="color:red;">`array`</mark> of error codes that the associated actions will run with. |
| actions | array of actions                                                                                  |

The result from the example code above is the alert shown below.

<figure><img src="/files/0mwor88b2I4itkl3ggOF" alt=""><figcaption></figcaption></figure>

The error data can be found under <mark style="color:red;">`options`</mark> for each action of the array, for a given code. The error object has the same shape as previously presented [here](/engineering-reference-docs/betterforms-error-pages-api/custom-error-pages.md) and can be accessed as follows:

| Key                                           | Path                              |
| --------------------------------------------- | --------------------------------- |
| <mark style="color:red;">`code`</mark>        | actions.options.error.code        |
| <mark style="color:red;">`description`</mark> | actions.options.error.description |
| <mark style="color:red;">`message`</mark>     | actions.options.error.message     |